Tailwind CSS Components
Collection of Tailwind CSS components for everyone to use. Browse all of the components that's right for your project.

Tailwind CSS Warning Alert
Tailwind CSS Warning Alert component

Tailwind CSS Primary Alert
Tailwind CSS Primary Alert component

Tailwind CSS Danger Alert
Tailwind CSS Danger Alert component

Tailwind CSS Primary Alert With Actions
Tailwind CSS Primary Alert With Actions Components

Tailwind CSS Warning Alert with large Icon and Action
Tailwind CSS warning alert witih large icon and action component

Tailwind CSS Basic Alerts
Tailwind CSS basic alerts component with text. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Basic Alerts With Header
Tailwind CSS basic alerts component with header. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Basic Closable Alerts
Tailwind CSS basic closable alerts component with text. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Success Alert
Tailwind CSS Success Alert component

Tailwind CSS Delete Alert With Large Actions
Tailwind CSS delete alert with large actions component

Tailwind CSS Basic Alerts With Icon
Tailwind CSS basic closable alerts component with icon and text. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Basic Alerts With Filled Background
Tailwind CSS basic alerts component with a filled background. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Basic Alerts With Border
Tailwind CSS basic alerts component with border. This component contains the info alert, danger alert, success alert, warning alert, and default alert.

Tailwind CSS Basic User Avatar Round
Tailwind CSS basic user avatar (round) component

Tailwind CSS Basic User Avatar Square
Tailwind CSS basic user avatar (round) component

Tailwind CSS Stacked Avatar
Tailwind CSS stacked avatar component

Tailwind CSS Avatar Round With Status
Tailwind CSS avatar round with status indicator component

Tailwind CSS Default Badges With Icon
Tailwind CSS Default badges components with icon. This component includes the default badge, success badge, danger badge, warning badge, and info badge.

Tailwind CSS Default Badges
Tailwind CSS Default badges components. This component includes the default badge, success badge, danger badge, warning badge, and info badge.

Tailwind CSS Simple Number Badge
Tailwind CSS simple number badge components

Tailwind CSS Simple Icon With Badge
Tailwind CSS simple number icon with badge component

Tailwind CSS Basic Breadcrumbs With Slash Component
Tailwind CSS Basic Breadcrumbs With Slash Component

Tailwind CSS Basic Breadcrumbs Component
Tailwind CSS Basic breadcrumbs component. This component is the variant with chevrons.

Tailwind CSS Basic Breadcrumbs with Pipe Component
Collection of Tailwind CSS breadcrumbs with pipe components. This component contains the pipe divider.

Tailwind CSS Button Group
Collection of Tailwind CSS Button Group components which includes the typical default button, danger button, warning button, info button, success button, light button, and dark button

Tailwind CSS Gradient Button
Collection of Tailwind CSS Gradient Button components which includes the typical default button, danger button, warning button, info button, success button, light button, and dark button

Tailwind CSS Button Size Variant
Tailwind CSS button size variant component. This variant contains the large, default, and small button sizes.

Tailwind CSS Button With Badge
This component is a button component with the badge to indicate the total number of actions/processes the button is performing

Tailwind CSS Button with Icon
Collection of Tailwind CSS Button with icon components, The icon can be placed leading the text or trailing the text.

Tailwind CSS Rounded Icon Buttons
This component contains the rounded icon button variant usually suitable for batch action processing.

Tailwind CSS Dropdown Button
This component is the implementation of the Tailwind CSS dropdown button. The color can be customized based on the use case of the dropdown button.

Tailwind CSS Default Button
Collection of Tailwind CSS Default Button components which includes the typical default button, danger button, warning button, info button, success button, light button, and dark button

Tailwind CSS Outline Button
Collection of Tailwind CSS Outline Button components. This includes the typical outline default button, danger outline button, warning outline button, info outline button, success outline button, light outline button, and dark outline button.

Tailwind CSS Pill Buttons
Collection of Tailwind CSS pill button that includes the typical default button, danger button, warning button, info button, success button, light button, and dark button.

Tailwind CSS Buttons with Shadows
Collection of Tailwind CSS Buttons with Shadows for primary, success, warning, alert, secondary and default buttons

Tailwind CSS Basic Card
Collection of Tailwind CSS Basic and simple card component

Tailwind CSS Basic Category Card
Tailwind CSS basic category card component

Tailwind CSS Order Card
Tailwind CSS order card component

Tailwind CSS Feature Card
Tailwind CSS Feature Card component

Tailwind CSS Property Card
Collection of Tailwind CSS Property Card Components

Tailwind CSS Card With Image and Text Vertical
Tailwind CSS card with image and text vertical. Suitable to show simple listing such as blog post with a cover image that's vertically stacked with each other.

Tailwind CSS Card Image With Text Over
Tailwind CSS card image component with text over, useful for showing featured content that has image component

Tailwind CSS Card With Text
Tailwind CSS simple card with a plain text component. Suitable to show simple listing such as blog post.

Tailwind CSS Blog Post Card
Tailwind CSS blog post card component is suitable for blog post listing

Tailwind CSS Simple Feature Card
Tailwind CSS Simple feature card component

Tailwind CSS Card With Image
Tailwind CSS card with image component, useful for showing featured content on a page

Tailwind CSS Card With Image and Text Horizontal
Tailwind CSS card with image and text horizontal. Suitable to show simple listing such as blog post with a cover image.

Tailwind CSS User Card
Tailwind CSS user card component

Tailwind CSS Basic Filter
Collection of Tailwind CSS Basic Filter

Tailwind CSS Simple Feature Card Alt
TailwindCSS simple feature card show stats with interactive icons and straight forward details

Tailwind CSS Hotel Card Component
Tailwind CSS Hotel Card Component

Tailwind CSS Recipe Card Component
Tailwind CSS Recipe Card Component

Tailwind CSS Profile Card Component
Tailwind CSS Profile Card Component

Tailwind CSS Bar Chart With Spacing
Tailwind CSS Bar Chart With Spacing Component

Tailwind CSS Column Chart With Label
Tailwind CSS Column Chart With Label Component

Tailwind CSS Bar Chart Component
Tailwind CSS Bar Chart Component suitable to display statistics on your website

Tailwind CSS Basic Bar Chart Reverse
This component is Tailwind CSS Basic Bar Chart Reverse which is useful to show your statistics for RTL orientation

Tailwind CSS Bar Chart With Label
This bar chart component can also have label to indicate each of the bar information

Tailwind CSS Bar Chart With Data Axes
Tailwind CSS Bar Chart With Data Axes Component

Tailwind CSS Bar Chart With Axes
This Tailwind CSS Bar Chart With Axes component come with axes to provide an indication of the scale for the bar

Tailwind CSS Basic Column Chart Component
Tailwind CSS Column Chart Component

Tailwind CSS Column Chart Reverse
Tailwind CSS Column Chart Reverse Component

Tailwind CSS Column Chart With Axes
Tailwind CSS Column Chart With Axes Component

Tailwind CSS Column Chart With Data Axes
Tailwind CSS Column Chart With Data Axes Component

Tailwind CSS Column Chart With Spacing
Tailwind CSS Column Chart With Spacing Component
There are currently no components available

Tailwind CSS Button Pagination
Tailwind CSS simple button pagination component

Tailwind CSS Pagination With Icons
Tailwind CSS pagination with icons component

Tailwind CSS Bordered Pagination
Tailwind CSS bordered pagination component

Tailwind CSS Round buttons pagination
Tailwind CSS round buttons pagination

Tailwind CSS Progress Bar With Custom Sizes
Tailwind CSS progress bar with custom sizes that are suitable for different part of your web application

Tailwind CSS Progress Bar With Label Chip
This is Tailwind CSS Progress Bar With Label Chip component and it makes use chip to give emphasize on the progress label

Tailwind CSS Progress Bars with Labels
Tailwind CSS Progress bars component with labels to display an indicator of the progress in percentage

Simple Tailwind CSS Progress Bar
Basic Tailwind CSS Progress bar component for displaying progress

Multiple Tailwind CSS Progress Bars
Multiple Tailwind CSS Progress bar component for displaying progress for different levels

Tailwind CSS Progress Bar With Different Color Variants
Tailwind CSS progress bar with different color variants that are suitable for different progress indicators

Tailwind CSS Progress Bar With Label Outside
This Tailwind CSS progress bar component has label outside with different opacity we can display the level and scale of the progress

Tailwind CSS Basic Ratings Component
Tailwind CSS Basic rating component is suitable to display user satisfaction over the content/elements on your website

Tailwind CSS Ratings Component With Emoji
This Tailwind CSS component display emoji as the indicator of user satisfaction. From angry to neutral and love it emoji, the emoji describes the level of user satisfaction with the content

Tailwind CSS Basic Ratings With Label
Tailwind CSS Basic Ratings With Text which can display additional indicators of the actual value of the ratings

Tailwind CSS Filled Ratings Component
This Tailwind CSS component is the filled variant and it's used to indicate the value that user has rate

Tailwind CSS Ratings Component With Custom Icon
This Tailwind CSS Rating component comes with a custom icon which is a heart instead of a star and you might also consider this as a favorite rating.

Tailwind CSS Basic Rating With Count
This Tailwind CSS Basic Rating comes with average counts and it's suitable to display the summary and overview of your content rating

Tailwind CSS Basic Ratings With Different Sizes
Tailwind CSS Basic rating component with different size variant that fits right on any page section of your website
There are currently no components available

Tailwind CSS Basic Tabs
Tailwind CSS basic tabs component. This component makes use of simple traditional tab styling with a mobile responsive layout.

Tailwind CSS Pill Tabs Component
Tailwind CSS Pill Tabs component suitable for sub/secondary tabs

Tailwind CSS Elegant Tabs
Tailwind CSS Elegant Tabs Component. This component makes use of modern tab styling and has a subtle hover/active state with a mobile responsive layout