Color Palette
Green
#58CC02
Green Hover
#4BB200
Blue
#1CB0F6
Dark Blue
#100F3E
Red
#FF4B4B
Orange
#FF9600
Golden
#FFC800
Footer Green
#4EC604
Gray Text
#4B4B4B
Gray Light
#777777
Nav Text
#AFAFAF
Border
#E5E5E5
Typography
Display
Heading One
heading two
Body text for paragraphs and descriptions with comfortable reading line-height.
Caption Label
Small utility text for metadata and hints
Button Variants
Primary
Secondary
Ghost
Dark Theme Buttons
Cards
New
Spanish for Beginners
Start your language journey with interactive lessons designed to build fluency.
Popular
French Conversations
Practice real-world dialogue and improve pronunciation with native speakers.
Dark Theme Cards
Super
Unlimited Hearts
Keep learning without interruption with Super Duolingo benefits.
Pro
Mastery Quizzes
Challenge yourself with advanced assessments to test your skill level.
Components
Badges
Completed
In Progress
Failed
Streak
Premium
Input + Button
Toggle
Progress
85%
60%
35%
Tooltips & Streak
Hover meHelpful tooltip
🔥42
Dark Theme Components
Language Pills
Spanish
French
German
Japanese
Avatar Group
+5
Progress
72%
45%
Badges
Mastered
Review
Crown