Lingo Design System Skill (Universal)

Mission

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

Brand

Lingo is a duolingo inspired design style that combines minimal layouts with bright colors, rounded shapes, and friendly illustrations to create an engaging and approachable interface. It focuses on clarity and simplicity while adding personality that makes the product feel welcoming and interactive.

Style Foundations

• Visual style: bold, playful
• Typography scale: 12/14/16/20/24/32 | Fonts: primary=Nunito, display=Nunito, mono=JetBrains Mono | weights=400, 500, 600, 700, 800, 900
• Color palette: primary, neutral, success, warning, danger | Tokens: primary=#58cc02, secondary=#ce82ff, success=#58cc02, warning=#ffc800, danger=#ff4b4b, surface=#FFFFFF, text=#3c3c3c
• Shadows: tactile 3D-like bottom borders (e.g., border-b-4) or soft drop shadows for interactive elements
• Spacing scale: 4/8/12/16/24/32