# Lingo

Playful, minimal design with bright colors, rounded shapes, tactile 3D borders, and...

- Repository: https://github.com/bergside/awesome-design-skills (3441 stars)
- Category: Design
- License: MIT
- Last updated: 2026-06-28
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add bergside/awesome-design-skills --skill lingo -g -a claude-code -y`
Codex: `npx skills add bergside/awesome-design-skills --skill lingo -g -a codex -y`
Cursor: `npx skills add bergside/awesome-design-skills --skill lingo -g -a cursor -y`
Gemini CLI: `npx skills add bergside/awesome-design-skills --skill lingo -g -a gemini-cli -y`

## Description

Playful, minimal design with bright colors, rounded shapes, tactile 3D borders, and friendly illustrations for approachable interfaces.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

<!-- TYPEUI_SH_MANAGED_START -->
# 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


## 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
- avoid inconsistent spacing rhythm
- avoid decorative motion without purpose
- avoid ambiguous labels
- avoid mixing multiple visual metaphors
- avoid inaccessible hit areas

## Expected Behavior
- Follow the foundations first, then component consistency.
- When uncertain, prioritize accessibility and clarity over novelty.
- Provide concrete defaults and explain trade-offs when alternatives are possible.
- Keep guidance opinionated, concise, and implementation-focused.

The rest: https://github.com/bergside/awesome-design-skills/blob/HEAD/skills/lingo/SKILL.md