
from pagible528
Opinionated, accessibility-focused design system for the 'Clean' theme: minimal visuals, defined tokens, component rules, and a QA checklist to ensure consisten
The Clean Theme Design System provides a complete, opinionated set of design tokens, component rules, accessibility requirements, and authoring workflow for a minimal, whitespace-focused website theme. It describes typography scales, color tokens, spacing, border radii, component anatomy (hero, cards, blog layout, FAQ accordion, forms), and a QA checklist so implementers can reproduce a consistent, accessible UI across a site or set of templates.
Use this skill when you need a production-ready theme guide for a documentation site, marketing pages, or a blog where clarity, legibility, and WCAG 2.2 AA accessibility are priorities. Ideal for theme authors, template implementers, or front-end engineers adopting a Pico CSS–based design system who want a single source of truth for tokens, component states, and migration notes.
Best used by code-capable assistants and agents that output HTML/CSS examples or design tokens (Copilot/Codex, Cursor, Claude Code). It supports tasks like generating theme CSS, component code, and accessibility checklists.
A well-crafted design system skill for the 'Clean' theme built on Pico CSS. Provides detailed design tokens (colors, typography, spacing), component rules, accessibility guidelines (WCAG 2.2 AA), and a QA checklist. No executable scripts — purely instructional. The skill is thorough and opinionated in a good way, with concrete do/don't rules anchored to specific tokens. Niche audience but genuinely useful for frontend agents working with this theme.
No security concerns — no scripts, no network calls, no executable content. Pure design system documentation. Well-structured with clear tokens, accessibility requirements, and anti-patterns. Could benefit from code examples (HTML/CSS snippets) to demonstrate the design patterns in practice.