本页出处
设计风格资料库
内容来自 luckymaomi 的 UI 风格库(复刻版),以 MIT 许可 提供。本站镜像收录,仅作学习参考;这一页的原始地址是 原站页面。
← 回到导览访问原站仓库
返回配方目录
Graffiti Street

涂鸦街头组件配方

font-black uppercase tracking-widest rounded-none border-2 skew-x-[-2deg] transition-all duration-200 bg-[#ff2d55] text-white border-[#ff2d55] shadow-[4px_4px_0_#00e5ff] hover:translate-x-[2px] hover:translate-y-[2px] hover:shadow-none active:scale-[0.97]
button

按钮

Urban spray-paint button with neon accents and bold uppercase text on dark surfaces

基础骨架
font-black uppercase tracking-widest rounded-none border-2 skew-x-[-2deg] transition-all duration-200
变体
主要、次要、强调
状态
hover、active、disabled
card

卡片

Dark urban card with spray-paint drip borders and neon accent highlights

基础骨架
bg-[#1c1c1e] border-2 border-[#ff2d55] rounded-none text-white transition-all duration-300
变体
默认、霓虹
状态
hover
input

输入框

Dark street-style input with neon underline focus and bold placeholder

基础骨架
w-full bg-[#1c1c1e] border-2 border-gray-700 rounded-none font-bold text-white placeholder:text-gray-500 placeholder:uppercase placeholder:tracking-wider focus:outline-none transition-all duration-200
变体
默认、霓虹
状态
focus、disabled