核心原理
粘土风的核心其实就是:大圆角 + 双重阴影。
你需要两个阴影:一个内部阴影 (Inset Shadow) 营造凹陷或高光感,一个外部阴影 (Drop Shadow) 营造悬浮感。
01
设置背景色
不要用纯白,要用 Cream (#FDFBF7) 或极淡的 Pastel 色系。
02
添加大圆角
起步价 rounded-2xl,胆子大的直接用 rounded-full。
03
叠加阴影
使用 Tailwind 的 shadow-[...] 语法叠加多层阴影。
代码示例
<div className="
bg-white
rounded-3xl
shadow-[0_10px_20px_rgba(0,0,0,0.05),_inset_0_-5px_10px_rgba(0,0,0,0.02)]
">
我是粘土卡片
</div>