按钮
Retro pixel-style button with hard edges and 8-bit aesthetics
- 基础骨架
font-mono font-bold border-2 border-black rounded-none uppercase tracking-wider transition-all duration-150- 变体
- 主要、次要、轮廓
- 状态
- hover、active、disabled
像素艺术风组件配方
font-mono font-bold border-2 border-black rounded-none uppercase tracking-wider transition-all duration-150 bg-[#306230] text-[#8bac0f] shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:shadow-none hover:translate-x-[4px] hover:translate-y-[4px] active:translate-x-[4px] active:translate-y-[4px]卡片
Pixel grid card with retro game-style borders
- 基础骨架
bg-[#e0d8b0] border-4 border-black rounded-none font-mono transition-all duration-200- 变体
- 默认、强调、深色
- 状态
- hover
输入框
Pixel-style input with sharp corners and mono font
- 基础骨架
w-full border-2 border-black rounded-none bg-[#e0d8b0] font-mono text-black placeholder:text-black/40 focus:outline-none transition-shadow duration-150- 变体
- 默认、深色
- 状态
- focus、disabled