作品解构结构母版v1.0 已发布
8.1K
作品解构结构母版 Design System作品解构结构母版 建立了一套Glass、Grid 的网页界面系统。可复用层是字体、色彩、间距、圆角、表面、组件和基础动效；特殊 Skill 单独映射。
Typography
Heading systemInter / 46px / 600 / - / -Body systemInter / 17px / 400 / - / -Inter
LettersAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk LlNumbers01 02 03 04 05 06 07 08 09
Colors
Primary#080807

13% usage signal

Secondary#F4F0E9

50% usage signal

Tertiary#10100F

25% usage signal

Neutral#070707

13% usage signal

linear-gradient(135deg,#10100f,#070707 58%,#14101a)linear-gradient(135deg,#ffffff08 0 1px,transparent 1px 28px)linear-gradient(160deg,#1d1d1b,#131313)
Layout
LayoutGridWidthFull BleedGridStrongFramingGlass
导航与入口主叙事区视觉场与背景层内容/数据表面行动路径
Spacing
6px5pxTitle block

Description copy reflects measured rhythm, icon offset, and CTA spacing.

5px6px7px8px9px10px12px14px16px22px
Buttons
Product
Elevation & Depth

Depth is communicated through surfaces, borders, shadows, and blur treatments.

Reusable shadowsReusable shadows / Gradient surfaces
Surface sampleGlass
SurfaceGlassBorder1px solid currentColor / low opacityShadow0 18px 50px rgba(15,23,42,.14)Blur0px
Shapes

Shapes define the radius family for cards, inputs, tags, and supporting surfaces.

8pxradius-110pxradius-212pxradius-314pxradius-4
Card surfaceInput fieldStatus pill
UI Design Lab Skills
容器线框SupportLayout / Spacing框架网格布局SupportLayout / Spacing