Neumorphism CSS Shadow——两层代码
直观地构建 CSS 框阴影代码：用于偏移、模糊、扩散、不透明度颜色、插入模式和最多四层的滑块（带实时预览）。
处理中...
0%
结果
此页面打开生成器，其中已构建了经典的同形对：近白色的浅层偏移 -8px/−8px 和柔和的灰蓝色的暗层偏移 8px/8px，两者都模糊了 16px。在层列表中的两个层之间切换以独立调整每一侧。
Neumorphism（软 UI）是一种浮雕风格，在 2020 年左右达到顶峰：元素看起来是从背景中挤出来的，而不是漂浮在背景之上。老实说，它带来了真正的权衡——只有当元素的背景与页面背景匹配时，效果才起作用，而低对比度的边缘会损害可访问性——所以大多数团队现在将其用作强调，而不是整个设计语言。
如果样式适合您的项目，则此两层声明是规范的起点：复制 CSS，将元素和页面背景设置为相同的柔和灰色，并添加匹配的边框半径。一切都在您的浏览器本地运行。