minimal

Enforce token-driven typography, spacing, and color rules for UI components.

Updated May 13, 2026
One-click install
npx skills add https://github.com/superpollo02/awesome-design-skill --skill minimal-superpollo02
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: minimal
Source: https://github.com/superpollo02/awesome-design-skill/tree/main/skills/minimal
Command: npx skills add https://github.com/superpollo02/awesome-design-skill --skill minimal-superpollo02

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Minimal design instructions prevent inconsistent spacing, low-contrast typography, and accessibility regressions by grounding UI decisions in a strict token and rule set.

Core Features & Use Cases

  • Tokenized foundations: Defines a whitespace-forward system (4/8/12/16/24/32), typography scale (Inter/Open Sans/Inconsolata), and a restrained palette (primary/neutral/success/warning/danger).
  • Accessibility and interaction rules: Enforces WCAG 2.2 AA principles, keyboard-first behavior, and explicit visible focus states across components.
  • Implementation-ready component guidance: Provides do/don’t patterns and quality gates so engineers can produce consistent states, hierarchy, and content tone.

Quick Start

Use the minimal skill to generate a consistent, whitespace-driven design-system specification for a new set of components.

Frequently Asked Questions about minimal

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

FAQPage Schema
How do I enforce WCAG 2.2 AA accessibility rules in a minimal UI design system?▼

To enforce WCAG 2.2 AA accessibility rules in a minimal UI, apply token-driven typography and explicit focus states to ensure keyboard-first interactions and clear visual hierarchy. This standardizes component states and prevents accessibility regressions.

What is the best way to standardize spacing and typography tokens for UI components?▼

Standardizing spacing and typography tokens for UI components is best achieved by enforcing a strict whitespace-forward scale, such as 4/8/12/16/24/32, and a defined typography scale using Inter, Open Sans, or Inconsolata. This ensures consistent implementation across component families.

How do I generate a design system specification for a new set of components?▼

Generate a design system specification for new components by applying token-driven rules that define restrained color palettes, explicit interaction states, and do/don't patterns. This creates implementation-ready guidance with acceptance-testable quality gates.

Does this approach to minimal design support semantic tokens over raw color and spacing values?▼

Yes, this minimal design approach supports semantic tokens over raw values to maintain consistent visual hierarchy and accessibility. Applying semantic tokens prevents low-contrast typography and spacing inconsistencies across component variants and interaction states.

When should I not use a whitespace-forward minimal design system?▼

You should not use a whitespace-forward minimal design system when your product requires highly decorative visual hierarchy or complex color usage outside a restrained palette. This token-driven approach strictly enforces clarity-first rules that may limit expressive UI design.

Can I use this minimal style system for component families and interaction states?▼

Yes, you can use this minimal style system for component families and interaction states because it provides do/don't patterns and quality gates. This ensures engineers produce consistent hierarchy, content tone, and explicit visible focus states across all variants.