sleek

Name: sleek
Availability: InStock
Author: superpollo02

Generate token-based UI guidelines with WCAG 2.2 AA accessibility criteria.

Updated May 13, 2026

Search Tags:#typography #accessibility #design system #interaction states #token palette #minimalist UI

Ready to run

npx skills add https://github.com/superpollo02/awesome-design-skill --skill sleek-superpollo02

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: sleek
Source: https://github.com/superpollo02/awesome-design-skill/tree/main/skills/sleek
Command: npx skills add https://github.com/superpollo02/awesome-design-skill --skill sleek-superpollo02

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Sleek turns minimalist design intent into consistent, implementation-ready guidance so teams can ship clean, accessible interfaces without visual or accessibility drift.

Core Features & Use Cases

Token-driven foundations: Inter typography, JetBrains Mono labels, an explicit primary/secondary/success/warning/danger palette, and an 8pt baseline spacing rhythm.
Accessible interaction patterns: WCAG 2.2 AA targets with keyboard-first behavior and visible focus-visible requirements.
Opinionated do/don’t rules: Preserves hierarchy and spacing consistency while preventing low-contrast text, inconsistent rhythm, and ambiguous labeling.

Quick Start

Use the sleek skill to generate component styling and interaction rules that follow its Inter/JetBrains Mono typography, Sleek color tokens, and WCAG 2.2 AA keyboard-first accessibility constraints.

Frequently Asked Questions about sleek

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I standardize UI components for consistent design system implementation?▼

Standardize UI components by applying token-based guidelines for typography, color palettes, and 8pt spacing rhythm to generate consistent anatomy, variants, and interaction states across web interfaces.

What are the WCAG 2.2 AA accessibility requirements for minimalist UI interaction states?▼

WCAG 2.2 AA requirements for minimalist UI mandate keyboard-first behavior, visible focus-visible states, and testable acceptance criteria to prevent low-contrast text and ambiguous labeling across default, hover, active, and disabled states.

How do I build accessible button and input variants using a token palette?▼

Build accessible button and input variants by mapping an explicit primary, secondary, success, warning, and danger token palette to component anatomy while enforcing opinionated do/don't rules for spacing consistency and hierarchy.

Does minimalist UI design require explicit loading and error interaction states?▼

Minimalist UI design requires explicit loading and error interaction states as relevant. You must define default, hover, focus-visible, active, and disabled states to pass the opinionated quality gate and prevent accessibility drift.

When should I not use token-driven foundations for web interface design?▼

You should not use token-driven foundations when a project requires highly custom visual styling outside an 8pt baseline grid, or when adhering to strict Inter and JetBrains Mono typography constraints is not feasible for your interface.

What is the best way to prevent visual and accessibility drift in design systems?▼

Prevent visual and accessibility drift by applying opinionated do/don't quality gates that enforce testable WCAG 2.2 AA acceptance criteria, consistent spacing rhythm, and explicit interaction states across all component-level rules.