skills.rest
bergside
bergsideOFFICIAL
Explore all skills by this author →
WebsiteGitHub

minimal

Standardize minimal design system rules with token-first typography, spacing, and WCAG 2.2 AA accessibility.

2.3k|211|Updated Mar 9, 2026
Search Tags:#accessibility#design system#typography scale#token-driven#keyboard-first#minimal UI
One-click install
npx skills add https://github.com/bergside/awesome-design-skills --skill minimal-bergside
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: minimal
Source: https://github.com/bergside/awesome-design-skills/tree/main/skills/minimal
Command: npx skills add https://github.com/bergside/awesome-design-skills --skill minimal-bergside

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Minimal design skills help you create clear, distraction-free interfaces with consistent typography, spacing, and restrained color that remain accessible.

Core Features & Use Cases

  • Clean visual hierarchy: Enforces a whitespace-first layout rhythm, preserving emphasis through typographic scale and spacing tokens.
  • Accessible interaction patterns: Guides keyboard-first behavior with WCAG 2.2 AA-aligned visible focus states and contrast-safe text.
  • Token-driven implementation: Standardizes primary/neutral/success/warning/danger colors plus a desktop-first type system (Inter/Open Sans/Inconsolata) to keep components consistent.

Quick Start

Use the minimal skill to generate design-system guidance and implementation-ready component rules for a new minimal product interface.

Frequently Asked Questions about minimal

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

FAQPage Schema
How do I enforce a minimal design system for consistent UI styling?▼

Standardize minimal design system instructions using token-driven rules. Predefined palettes and typography scales enforce consistent spacing and color across component states, solving inconsistent UI styling and unclear visual hierarchy.

How does token-driven UI design handle WCAG 2.2 AA accessibility?▼

Token-driven UI design ensures WCAG 2.2 AA accessibility by applying explicit constraints for contrast-safe text, visible focus states, and keyboard-first interaction patterns across all generated component variants.

Can I use a minimal UI skill for agent-driven web component generation?▼

Yes, a minimal UI skill applies to agent-driven UI generation by providing implementation-focused do/don't guidance and testable acceptance criteria for component families, ensuring tokens are enforced automatically.

What is the best way to build clean visual hierarchy with typography scales?▼

The best way to build clean visual hierarchy is enforcing a whitespace-first layout rhythm that preserves emphasis through predefined typographic scales and spacing tokens, ensuring distraction-free interfaces.

Do I need predefined color palettes to prevent accessibility regressions?▼

Yes, you need predefined primary/neutral/success/warning/danger color tokens to prevent accessibility regressions. Standardizing these tokens ensures contrast-safe text and consistent component behavior across all interaction states.

Related Skills

Explore More Design & Creative Skills→
qazuorqazuor

frontend-design

Guide UI teams through pre-coding design foundations for typography, color, and layout.

Community
Basic
bergsidebergside
2.3k

energetic

Define energetic design-system tokens, component states, and WCAG 2.2 AA focus rules.

Official
Intermediate
superpollo02superpollo02

creative

Generate design-system guidance for playful landing page UIs with tokens and WCAG 2.2 AA rules.

Community
Intermediate
tunneleventunneleven

c4flow:design

Generate design systems and UI mockups for specified features.

Community
Basic