Design System 7.0

Pure Motion Engine

A unified language for building intelligent interfaces. Combining transparent aesthetics with complex physics-based interactions.

FIGMA REACT VUE ANGULAR SVELTE TAILWIND FIGMA REACT VUE ANGULAR SVELTE TAILWIND
02 / Typography Spec
Heading 1 / Inter SemiBold

Velocity

Heading 2 / Inter Medium

Design Audit

Heading 3 / Inter Regular

Systematic Approach

Font Family

Inter, sans-serif

Primary UI

Monospace

JetBrains Mono

Code/Data

"Body Large - The quick brown fox jumps over the lazy dog."

20px 1.6 Line Height -0.01 Tracking

"Body Regular - Highly legible for long form content and detailed documentation pages."

16px 1.5 Line Height 0 Tracking

Captions & Labels

12px Uppercase 0.1em Tracking
03 / Color Palette
#000
#262626
#525252
#A3A3A3
#E5E5E5
#FFF

Primary

Main actions, text, headers.

HEX: #000000 RGB: 0,0,0

Accent

Links, highlights, focus rings.

HEX: #2563EB Usage: 10%

Success

Completion, valid states.

HEX: #22C55E Feedback

Error

Destructive actions, failures.

HEX: #EF4444 Feedback
04 / UI Components

Controls

Container & Feedback

Notifications

Real-time updates managed by WebSocket connections.

v1.0.0 Beta Live
Help info tooltip
05 / Iconography View All Icons ->
Home
Settings
User
Analytics
Files
Magic