Interface Lab

Signal OS Creative Ops Dashboardv1.0 Published

5.2K

Signal OS Creative Ops Dashboard Design SystemSignal OS Creative Ops Dashboard establishes a gradient shell grid system for product workspace. The reusable layer is the typography, palette, spacing, radius, surface, component, and motion baseline; special Skills are mapped separately.

Typography

Heading systemInter / 54px / 600 / 1.05Body systemInter / 14px / 400 / 1.55Inter

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

Colors

primary#07110F

25% usage signal

secondary#EFFFF8

8% usage signal

tertiary#2EE8BC

8% usage signal

neutral#FFFFFF

25% usage signal

radial-gradient(circle at 75% 10%,#2ee8bc44,transparent 35%)

Layout

LayoutGridWidthFull BleedGridStrongFramingGradient shell

Navigation & EntryPrimary NarrativeVisual Field & BackgroundContent / Data SurfaceAction Path

Spacing

14px12pxTitle block

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

12px14px18px22px34px

Buttons

Product

Icons

Linear- Radius family: 22px, 999px - Icon style: Linear

Elevation & Depth

- Surface: Gradient shell - Border: 1px solid currentColor / low opacity - Shadow: 0 18px 50px rgba(15,23,42,.14) - Blur: 0px

Reusable shadowsReusable shadows / Gradient surfaces

Surface sampleGradient shell

SurfaceGradient shellBorder1px solid currentColor / low opacityShadow0 18px 50px rgba(15,23,42,.14)Blur0px

Shapes

- Radius family: 22px, 999px - Icon style: Linear

22pxsurface999pxpill

Card surfaceInput fieldStatus pill

Do's and Don'ts

Use these constraints as design lint rules for future generations.

DoMaintain the Design System as the first Skill layer for every work.Reuse type, color, spacing, radius, surfaces, and component rules before adding special Skills.Bind every special Skill to concrete regions to avoid global style drift.Generate DESIGN.md first for new works, then decide which local effects should become Skills.

Don'tDo not let WebGL, Three.js, or motion redefine the global type and component system.Do not describe a work only with visual adjectives; map it to tokens, regions, and Skills.Do not save one-off page details as base Design System rules.

Interface Lab Skills

Border GradientssupportColors / ElevationMasked RevealsupportLayout / Components / ElevationFramed Grid LayoutsupportLayout / Spacing