Community-built
Tailwind CSS Components Library
Let's not stress about website designs. Create Stunning UIs Effortlessly, with Over 1800+ Ready to Use Components
Tailwind Playground
Experience the power of Tailwind CSS - Play around in our playground, with live preview and a user-friendly code editor.
Create, Save, Share.
Create, save, share and organize your components with ease. Save your components, share them with others, and keep your favorites at hand for easy access.
User profile
Make a name for yourself - Create a good profile and showcase your designing skills to the world.
Tags
-
245
-
140
-
131
-
96
-
95
-
92
-
88
-
88
-
75
-
70
-
68
-
62
Recent
-
1 day ago7
-
quora/reddit
reddit / quora have some kind of same template. looksalikes. brothas
1 day ago25 -
Pricing Plans UI
A modern, responsive pricing plan cards
2 days ago12 -
Records Form - HPower
records survey form
2 days ago12 -
Fullscreen 🍪 Cookies Notice
A modern and responsive modal with a clean design
3 days ago8 -
Safari mockup Browser page
This component is a mockup of a Safari browser window, featuring a realistic and responsive design created with Tailwind CSS. It includes the following elements: Tab Bar: Positioned at the top of the window, the tab bar showcases an active tab with a favicon and a title. The active tab is highlighted with a background color and border for clarity. Toolbar: Below the tab bar, the toolbar mimics the Safari browser's functionality with close, minimize, and maximize buttons. It also features an address bar pre-filled with a URL, styled for a polished look. Navigation Buttons: The toolbar contains navigation buttons designed with SVG icons to represent back, forward, and other standard browser actions. Content Area: The main section of the browser window, styled to display content within the mockup. It includes a heading and a description to illustrate the use of the component.
4 days ago22 -
Tailwind Header
responsive mobile menu with a smooth transition
6 days ago209
Trending Users of last 30 days
-
# 1Prajwal Hallale
Hello there, I am a fullstack web developer.
61 components5.1k -
# 2Samuel Abera
Bringing web ideas to life! Full-stack developer with 4 years of experience.
39 components3.1k -
# 3Amit Pachange
I'm an Artist, App developer and Web developer.
33 components2k -
# 4Michael Andreuzza
❖ UI Design ✺ Front End Project: http://lexingtonthemes.com ⏤ Free & Premium themes crafted with Astro.js & Tailwind CSS
36 components2k -
# 58 components1.6k
-
# 6Coastal UI
Changing Svelte front-end development, one component at a time. Visit coastalui.com for more.
9 components1.3k -
# 720 components1.3k
-
# 815 components1.3k
-
# 928 components1.2k
-
# 1016 components928
-
# 1126 components917
-
# 12Pagedone
Build websites faster than ever before with our open-source library featuring 1000+ UI components, sections, and pages designed in Figma and built on Tailwind CSS.
26 components858 -
# 1315 components797
-
# 145 components710
-
# 155 components643
Trending Components of last 30 days
-
# 1Flour mill website landing page template
flour mill and services template website which comprise of many sections like about us, featured products, why us, visit us
author
Amit Pachange1.8k -
# 2
-
# 3Carousel with Tailwind CSS and Alpine.js
Simple card Carousel
author
Brandon D1.5k -
# 4
author
Brandon D1.4k -
# 5Daystar Day care Dashboard
Daystar Day care Dashboard
author
Paul Livingstone Ssenoga1.3k -
# 6Products cards w/ hover effect
Example of product card grid with product image, pricing and a hover effect FORKED FROM: https://tailwindflex.com/noob_dev/products-card-grid
author
threehymns1.3k
F.A.Q
Who is responsible for creating and maintaining this library?
This library is a collaborative effort of the Tailwind CSS community. It's created and updated by contributors.
Are the components in the library free to use in my projects?
Yes, all components in the library are completely free to use in your personal or commercial projects. They are shared under open-source licenses, which allow for free usage, modification, and distribution.
How do I use the components from the library in my project?
Each component in the library comes with code snippet. You can copy and paste the provided code from component page.
Can I contribute to the library?
Absolutely! We encourage contributions from the community. If you have Tailwind CSS components or templates that you'd like to share, you can build and submit them to the library via Tailwind Playground . Be sure to follow our Contribution guidelines .
Stay Updated
Receive notifications about recently added high-quality components only once or twice a week. We do not spam.