Skills
.Work. You
Rest

lingo

Community

Create accessible, playful UI design systems

Design & Creative#accessibility#design tokens#design-system#ui-guidelines#brand style#component states
AuthorPiercingXX
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Lingo helps teams turn a brand style direction into practical, implementation-ready design-system guidance that engineering and design can apply consistently.

Core Features & Use Cases

  • Token-first foundations: Defines typography, color, spacing, and tactile ā€œ3Dā€ visual rules anchored to explicit tokens (e.g., primary #58cc02, typography scale 12/14/16/20/24/32).
  • Component-level guidance patterns: Specifies how to document component anatomy, variants, and interaction states (default, hover, focus-visible, active, disabled, loading, error where relevant) so UI behavior stays consistent.
  • Accessibility and QA-ready acceptance criteria: Enforces WCAG 2.2 AA principles with testable rules and a code-review-friendly QA checklist, plus anti-patterns to prevent regressions.

Quick Start

Ask an AI to generate Lingo-compatible UI component rules for your next button and ensure focus-visible, disabled, and error/loading states include explicit token-based sizing, colors, and testable acceptance criteria.

Dependency Matrix

Required Modules

None required

Components

Standard package

šŸ’» Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: lingo
Download link: https://github.com/PiercingXX/xx-stack/archive/main.zip#lingo

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.