Style Guide
Design system documentation and visual reference for maintaining project consistency across the platform.
Motion & Animations
Blur Reveal
Premium Entrance Animation
Standard entrance uses filter: blur(12px) and duration: 1.2s.
Micro-Hover
Hover me for feedback
Hover scale is restricted to 1.015 for a subtle, high-end feel.
Colors
Background
Foreground
Primary
Secondary
Muted
Accent
Border
Card
Layout & Spacing
Grid Gap
Standard gap is gap-3 (12px).
Card Padding
Standard Padding
Internal padding is p-4 (16px).
Typography
H1 Hero
All the must-haves.
H2 Section
Latest Updates & Guides
H3 Card
Video guide title
Body Text
The quick brown fox jumps over the lazy dog. This is our default body text. Built for maximum clarity and elegance.
Muted text provides secondary information or helper text that is less prominent but remains legible.