Interface Lab

Kresna SaaS 页脚组件v1.0 已发布

8.1K

Kresna SaaS 页脚组件 Design SystemKresna SaaS 页脚组件建立了一套Glass、Grid 的营销落地页系统。可复用层是字体、色彩、间距、圆角、表面、组件和基础动效；特殊 Skill 单独映射。

Typography

Heading systemDM Sans / 42px / 600 / - / -Body systemDM Sans / 20px / 400 / - / -DM Sans

LettersAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk LlNumbers01 02 03 04 05 06 07 08 09

Colors

Primary#FFFFFF

75% usage signal

Secondary#2D3148

8% usage signal

Tertiary#1E4FC0

8% usage signal

Neutral#0E1014

8% usage signal

linear-gradient(135deg,#5b9ffb 0%,#1e5dd7 55%,#1448be 100%)

Layout

LayoutGridWidthFull BleedGridStrongFramingGlass

导航与入口主叙事区视觉场与背景层内容/数据表面行动路径

Spacing

6px5pxTitle block

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

5px6px7px10px11px12px14px16px18px22px

Buttons

Product

Icons

LinearKeep one stroke/fill rule and align icons to the spacing scale.

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-19pxradius-212pxradius-322pxradius-4

Card surfaceInput fieldStatus pill