按钮
Warm countryside button with soft serif text, rounded edges, and earthy tones
- 基础骨架
font-serif rounded-full transition-all duration-300 ease-in-out- 变体
- 主要、次要、轮廓
- 状态
- hover、active、disabled
田园核风组件配方
font-serif rounded-full transition-all duration-300 ease-in-out bg-[#5a8f5a] text-white shadow-md hover:shadow-lg hover:scale-105 active:scale-95卡片
Warm cottagecore card with linen-like background and floral border accents
- 基础骨架
bg-[#faf6f0] rounded-2xl border border-[#d4a0a0]/40 shadow-md transition-all duration-300 ease-in-out- 变体
- 默认、花朵、大地
- 状态
- hover
输入框
Warm cottagecore input with soft borders and earthy placeholder tones
- 基础骨架
w-full rounded-xl border border-[#8b7355]/30 bg-[#faf6f0] text-[#8b7355] placeholder:text-[#8b7355]/40 font-serif focus:outline-none transition-all duration-300 ease-in-out- 变体
- 默认、花朵
- 状态
- focus、disabled
花园面板
Linen-textured panel with vine border decoration for garden content
- 基础骨架
relative bg-[#faf6f0] rounded-2xl border-2 border-[#5a8f5a]/30 p-6 shadow-sm- 变体
- 默认、花朵、蜂蜜
- 状态
- 静态
植物徽章
Circular badge with pressed flower aesthetic for labels and tags
- 基础骨架
inline-flex items-center justify-center w-12 h-12 rounded-full bg-[#faf6f0] border-2 border-[#5a8f5a]/40 font-serif text-sm text-[#5a8f5a]- 变体
- 叶子、花朵、浆果
- 状态
- 静态
种子袋标签
Rectangular tag styled like vintage seed packet labels
- 基础骨架
inline-flex items-center gap-1 px-3 py-1.5 bg-[#f5d75f]/20 border border-[#8b7355]/30 rounded-lg font-serif text-sm text-[#8b7355]- 变体
- 默认、玫瑰、草本
- 状态
- 静态
梅森罐进度条
Progress bar styled like a mason jar filling up with preserves
- 基础骨架
relative h-8 bg-[#faf6f0] border-2 border-[#8b7355]/40 rounded-lg overflow-hidden- 变体
- 蜂蜜、果酱、草本
- 状态
- 静态
十字绣分隔线
Decorative divider with cross-stitch embroidery pattern
- 基础骨架
relative w-full h-6 flex items-center justify-center- 变体
- 默认
- 状态
- 静态
叶子卡片
Card with botanical leaf corner decorations
- 基础骨架
relative bg-[#faf6f0] rounded-2xl border border-[#5a8f5a]/30 p-6 shadow-sm- 变体
- 默认、秋季
- 状态
- hover
日记装饰
Decorative ornament for journal entries with botanical flourishes
- 基础骨架
flex items-center justify-center gap-3 text-[#8b7355]/50- 变体
- 默认
- 状态
- 静态
花园标签页
Tab component with botanical illustration styling
- 基础骨架
px-4 py-2 font-serif border-2 transition-all duration-200 text-[#8b7355]- 变体
- 花园、厨房、手工
- 状态
- active、hover
野花提示框
Alert boxes with wildflower-themed decorations
- 基础骨架
relative p-4 rounded-xl border font-serif- 变体
- 信息、警告、错误、成功
- 状态
- 静态
收获表格
Table styled like a seed catalog or planting schedule
- 基础骨架
w-full font-serif text-sm- 变体
- 默认
- 状态
- 静态