Tailwind UI Elements

Ready-to-use TailwindCSS code snippets for your next project. Get 8 Elements with 40+ variants with this package.

No additional setup or code is required. Copy the code of an element you like and paste it in your code and Voila! there you have it.

What it is?

This is a collection of UI Elements (with different variants) with the source code in TailwindCSS. Don't waste time creating elements from scratch. There are enough variants for every element, to get you started with your project.

What it is not?

It is not a component library. This is just a collection of individual elements like a button or a table. It does not have components like forms etc. It might contain simple components, but it is mainly focussed on individual elements. You can build components out of these elements quite easily.

What do you get?

You get access to a collection of the most commonly used elements built with TailwindCSS along with the source code. You can find multiple variants of the same element, like gradients, animations etc. Currently only elements which don't need JavaScript are available. In future, I might add support to React & other popular JS frameworks.

You get

• Preview
• Code
• Tailwind Playground link for the element
• tailwind.config.js file if any custom config is required.

List of Elements currently available (No JS required)

1. Input
2. Button
3. Image Card
4. Table
5. Toast
6. Gradient
7. Progress bar
8. Badge
9. Bonus