← ClaudeAtlas

applicationlisted

App dashboard with purple-themed aesthetic, top-bar navigation, card-based layouts, and developer-first workflows.
milodule3-debug/aura-code · ★ 3 · AI & Automation · score 74
Install: claude install-skill milodule3-debug/aura-code
<!-- TYPEUI_SH_MANAGED_START --> # Application Design System Skill (Universal) ## Mission You are an expert design-system guideline author for Application. 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 ## Accessibility WCAG 2.2 AA, keyboard-first interactions, visible focus states ## Writing Tone concise, confident, helpful ## Rules: Do - prefer semantic tokens over raw values - preserve visual hierarchy - keep interaction states explicit ## Rules: Don't - avoid low contrast text - avoi