tailwind-ui-components Tailwind Templates

Tailwind Ui Components

🔥 A React UI component library based on Tailwind

Tailwind_UI :fire:     GitHub license

React UI components build on top of TailwindCSS

Preview URL(incomplete): https://5imqx.sse.codesandbox.io/

Components :electric_plug:

component name: Alert
props accept:
children, variant = 'default', type = 'default', onClose, className}
component name: Avatar
props accept:
src, altText, rounded = 'full', size = 'large', className, ...rest 
component name: Base
props accept:
classes, component: Component = "div", bordered = false, rounded = "lg", shadow = "lg", ...rest 
component name: Breadcrumbs
props accept:
children, variant = 'default', separator = '/', className, ...rest 
component name: Button
props accept:
type = 'neutral', variant = 'default', LeftIcon, RightIcon, className, hoverAnimation = false, disabled = false, children, ...rest 
component name: Card
props accept:
children, shadow = 'md', rounded = 'md', classes, ...rest 
component name: Dropdown

List

props accept:
children, isOpen = false, align = 'left', onClose, className, ...rest 

Item

props accept:
props accept: children, className, ...rest
component name: HelperText
props accept:
children, type = 'info', className, ...rest
component name: Label
props accept:
children, variant = 'default', className, ...rest
props accept:
children, href, variant = 'default', className, ...rest
component name: List

List

props accept:
children, header, Component = 'ul', headerClassName, className, ...rest 

Item

props accept:
children, Component = 'li', className, ...rest
component name: Modal
props accept:
children, onClose, isOpen = false, className, ...other
component name: Pill
props accept:
children, type, iconBefore, iconAfter, className = '', ...rest
component name: Select

Option

props accept:
props accept:  className, ...rest 

Select

props accept:
props accept: className, valid, invalid, ...rest
component name: Table
props accept:
children, className, separated = false, ...other 

Tbody, Td, Tfoot, Th, Thead

props accept:
children, className, ...other

Tr

props accept:
children, className, type = 'odd', ...other
component name: TextArea
props accept:
children, valid, invalid, disabled, bordered = true, className, ...rest 
component name: TextInput
props accept:
type = 'text', disabled = false, bordered = true, labelVariant, labelChild, helperType, helperChild, valid, invalid, className, ...rest
component name: ToggleSwitch
props accept:
variant = 'primary', checked = false, disabled = false, className, ...rest
component name: Transition
props accept:
children, variant = '', ...rest

:handshake: Contributing

We welcome all contributions, whether you're reporting an issue, helping us fix bugs, improve the docs, or spread the word. We also welcome your suggestions and feedback.

Top categories

Loading Svelte Themes