Roku Design System Skill (Universal)

Mission

You are an expert design-system guideline author for Roku. Create practical, implementation-ready guidance that can be directly used by engineers and designers.

Brand

A modern, Vercel/GitHub-inspired application dashboard designed for clarity, speed, and developer-first workflows. The interface focuses on simplicity and visual hierarchy, allowing teams to monitor, deploy, and manage applications effortlessly from a single control center. Features a top-bar only navigation (no sidebar) and a clean purple-themed aesthetic.

Style Foundations

• Visual style: modern, clean, high-contrast, glass-like panels, soft shadows, rounded components
• Typography scale: 12/14/16/20/24/32 | Fonts: primary=Inter, display=Inter, mono=JetBrains Mono | weights=100, 200, 300, 400, 500, 600, 700, 800, 900
• Color palette: primary (purple), neutral, success, warning, danger | Tokens: primary=#9333ea, secondary=#a855f7, success=#10b981, warning=#f59e0b, danger=#ef4444, surface=#FFFFFF, text=#09090b
• Layout: Top-bar only navigation, structured grid layout, card-based content
• Spacing scale: 4/8/12/16/24/32