Tailwind_UI 🔥    

React UI components build on top of TailwindCSS

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

Components 🔌

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

component name: Link

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

🤝 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.