返回配方目录
VHS Aesthetic

VHS美学组件配方

font-mono font-bold uppercase tracking-widest rounded-sm border transition-all duration-200 bg-[#ff00ff] text-black border-[#ff00ff] shadow-[2px_2px_0px_0px_#00ffff] hover:shadow-[4px_4px_0px_0px_#00ffff,-2px_-2px_0px_0px_#ff00ff] hover:text-white active:translate-x-[2px] active:translate-y-[2px] active:shadow-none
button

按钮

Retro VHS tape button with scan line feel, monospace font and glitch accents

基础骨架
font-mono font-bold uppercase tracking-widest rounded-sm border transition-all duration-200
变体
主要、次要、幽灵
状态
hover、active、disabled
card

卡片

Dark card with VHS tape aesthetic, scan line overlay and retro glow

基础骨架
bg-black border border-white/20 rounded-sm overflow-hidden transition-all duration-300
变体
默认、品红、青色
状态
hover
input

输入框

VHS-style input with monospace font, retro glow and scan line feel

基础骨架
w-full bg-black border border-white/20 rounded-sm font-mono text-white placeholder:text-white/30 focus:outline-none transition-all duration-200
变体
默认、品红、青色
状态
focus、disabled