按钮组件
卡片组件
卡片标题
这是一个带有图片的卡片示例，展示了DaisyUI卡片组件的基本用法。
主题卡片
这是一个使用主题色彩的卡片，演示了不同的颜色变体。
紧凑卡片
新品
这是一个紧凑型卡片，包含徽章组件。
时尚
产品
表单组件
数据展示组件
进度条
统计数据
总点赞
25.6K
21% 比上月多
页面浏览量
2.6M
21% 比上月多
86%
任务完成
31 个任务剩余
表格
| 姓名 | 职位 | 部门 | |
|---|---|---|---|
| 1 | 张三 | 前端工程师 | 技术部 |
| 2 | 李四 | 产品经理 | 产品部 |
| 3 | 王五 | UI设计师 | 设计部 |
反馈组件
警告框
新软件更新可用。
您的购买已成功！
警告：无效的邮箱地址！
错误！任务失败成功。
加载动画
消息提示
评分组件
布局组件
手机样机
Hi.
英雄区块
欢迎
这是一个使用DaisyUI Hero组件的示例，展示了如何创建吸引人的页面标题区域。
分割线
或者
主要
次要
主题演示
主题切换
主题
主要颜色
这是主要颜色的示例
次要颜色
这是次要颜色的示例
强调颜色
这是强调颜色的示例
中性颜色
这是中性颜色的示例
交互组件
模态框
折叠面板
什么是DaisyUI？
DaisyUI是一个基于Tailwind CSS的组件库，它提供了语义化的CSS类名，让你能够快速构建美观的用户界面。
如何安装？
你可以通过npm安装：npm install daisyui，然后在你的Tailwind配置中添加它作为插件。
有哪些主题？
DaisyUI提供了30多个内置主题，包括明亮主题、暗黑主题和各种颜色主题，你也可以创建自定义主题。
抽屉导航
下拉菜单
点击
悬停