picky-design

Audit design systems for pixel deviations, token misuse, and accessibility gaps.

5|Updated Jan 28, 2026
One-click install
npx skills add https://github.com/kiruna-labs/picky-skills --skill picky-design
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: picky-design
Source: https://github.com/kiruna-labs/picky-skills/tree/main/picky-design
Command: npx skills add https://github.com/kiruna-labs/picky-skills --skill picky-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires .

What problem does it solve?

Picky-design provides an exhaustive design-system audit that uncovers every pixel-level deviation, token misuse, and accessibility gap across a codebase.

Core Features & Use Cases

  • Comprehensive visual consistency checks across typography, color, spacing, and layout.
  • Accessibility and responsive design validation aligned to WCAG 2.2 AA.
  • Generates a scored, file:line-precise report with actionable fixes and pattern metrics.
  • Use cases include pre-release design reviews, design-system health checks, and regression audits after UI changes.

Quick Start

Trigger a design audit on your codebase to start an exhaustive pixel-level, token-usage, and accessibility health check.

Frequently Asked Questions about picky-design

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

FAQPage Schema
How do I audit my web app for design token misuse and pixel deviations?

To audit your web app for design token misuse, trigger an exhaustive design-system audit that uncovers every pixel-level deviation and token gap, delivering a scored report with exact file:line references and remediation code examples.

What is a design-system health check and when do I need one?

A design-system health check is an exhaustive audit of visual consistency, token usage, and accessibility gaps across a codebase. You need one during pre-release design reviews or regression audits after UI changes and component updates.

How do I validate WCAG 2.2 AA accessibility compliance in a responsive web app?

You validate WCAG 2.2 AA accessibility compliance by running an audit that checks visual consistency, accessibility gaps, and responsive design layouts, generating a scored report with actionable remediation guidance and code examples.

Can I check visual consistency across typography, color, and spacing after a UI migration?

Yes, you can check visual consistency across typography, color, spacing, and layout by triggering an exhaustive audit after design-system migrations or component updates, producing a scored report with exact file:line references and pattern metrics.

Does a pixel-perfect design audit work with modern web apps using design tokens?

Yes, a pixel-perfect design audit works with modern web apps using design tokens, WCAG 2.2 AA requirements, and responsive layouts, revealing every token misuse and accessibility gap across your codebase.

What's the best way to find exact file locations for accessibility gaps in my codebase?

The best way to find exact file locations for accessibility gaps is running an exhaustive design audit that generates a scored, file:line-precise report with remediation guidance and pattern metrics across your codebase.