SCHEME C / paper-neumorphic-ui

纸雕 白纸里捏出来

整页一张冷灰白纸,界面元素靠双向光影「浮起」或「刻入」,不靠任何彩色区块。红色只给关键按钮、关键数字和能量核,面积控制在 5% 以内——是几套方案里最柔和、最像实物的一套。

底色#e8eaf0
强调#e03546
材质双向光影浮雕
适合创作工具 / 日程
暗色模式纸雕·暗面 C2
01

色彩 Palette

页面与卡片同色是这套体系的命门:一旦卡片单独上色,浮雕立刻破裂。

纸底 Paper#e8eaf0

亮面 Light#ffffff

暗面 Dark#c9cddb

强调红 Accent#e03546

主文字#2a2d3a

次文字#8a8fa3

弱文字#b0b4c6

深红#7a0f1e

/* 纸制新拟物 · 令牌 */
:root{
  --paper: #e8eaf0; --light: #ffffff; --dark: #c9cddb;
  --ink-1: #2a2d3a; --ink-2: #8a8fa3; --ink-3: #b0b4c6;
  --accent: #e03546; --accent-glow: rgba(224,53,70,.35);
  --shadow-out: 8px 8px 16px var(--dark), -8px -8px 16px var(--light);
  --shadow-in: inset 5px 5px 10px var(--dark), inset -5px -5px 10px var(--light);
  --r-card: 18px; --r-inset: 14px; --r-nav: 12px;
}
02

组件 Components

Buttons · 凸起 / 凹陷 / 主操作
Form · 输入永远凹陷
72%
凹凸日历 · 凸=普通 凹=今天 红点=有事件
2829301234 567891011
能量核 + 卫星节点
42
12待办 7进行中 3成员
03

立体配方 Depth

光源恒在左上:亮面 -8px -8px 16px #ffffff,暗面 8px 8px 16px #c9cddb;小元素缩到 4/8。

凸起 · Raised(8/16 阴影) 普通状态 / 卡片 / 主按钮
凹陷 · Inset(同参数 inset) 激活 / 今天 / 输入 / 导航槽
04

布局模式 Patterns

A · 单面板工作台:顶部胶囊导航(凹陷槽 + 选中凸起)→ 主视觉(能量核 / 甘特)→ 底部数据条。B · 卡片流:同底色凸起卡纵向堆叠,卡内条目用凹陷槽制造「卡上刻槽」。

+18%
项目42
本周新增+18%
存储6.8GB
成员3
05

规则 Rules

该做 / DO

  • 卡片与页面必须同底色,层次只靠阴影。
  • 红色每屏最多一处,给最重要的按钮或数字。
  • 凸 = 普通、凹 = 激活 / 今天,语义全站统一。
  • 标题字重 800,标签小字宽字距。

不该做 / DON'T

  • 不要彩色背景块或渐变卡片(能量核除外)。
  • 不要出现第二个光源方向。
  • 不要把阴影调得过重,会显脏。
  • 界面内不要用 emoji。