Github GitHub - saadeghi/daisyui: ⭐️ ⭐️ ⭐️ ⭐️ ⭐️ Tailwind Components
source link: https://github.com/saadeghi/daisyui
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Tailwind CSS Components
Adds component classes like btn
, card
and more to Tailwind CSS
DaisyUI
Features
- Tailwind CSS plugin
DaisyUI is a Tailwind CSS plugin. Install it, add it to yourtailwind.config.js
file. - Component classes
Adds component classes to Tailwind. Classes likebtn
,card
,… So you will end up with a cleaner HTML. - Semantic color names
Adds color names likeprimary
,secondary
,accent
,…. - Customizable
You can customize the design of components with Tailwind utility classes and CSS variables. - Themeable
Add multiple themes and customize colors. You can even set a theme for a specific section of your page. - RTL supported
Enablertl
config for right to left layouts. - Pure CSS
No script file, no dependencies. 2KB gzip!
Install now!
npm i daisyui --save
Then add DaisyUI to your tailwind.config.js
[ Read more ]
module.exports = { plugins: [ require('daisyui'), ], }
Or use a CDN
Use
Use component classes like btn
, card
, etc… to build your UI.
<a class="btn">Hello!</a>
<div class="shadow card"> <div class="card-body"> <h2 class="card-title">Card Title</h2> <p>Card text</p> </div> </div>
See all components
Try it online
Documents + Examples
Read the documents for more info
[ daisyui.com ↗︎ ]
List of components
༼ つ ◕_◕ ༽つ Please share
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK