Paul BakausandClaude Opus 4.5 0b9c1846a6 Add teach-impeccable and review commands, dynamic placeholders
New commands:
- /teach-impeccable: One-time setup that gathers UX-focused design
  context (explores codebase first, then asks targeted questions)
- /review: UX design review evaluating hierarchy, clarity, emotional
  resonance (complements technical /audit)

Build system improvements:
- Dynamic {{model}}, {{ask_instruction}}, {{config_file}} placeholders
  per provider (Claude/Gemini/GPT/the model)
- context: fork support for Claude Code sub-agents (audit, extract)
- Skill reference auto-added to design commands

Skill refinements:
- Merged Design Thinking and Context Awareness sections
- Removed redundant patterns and technical questions
- More direct feedback guidance (radical candor)

Website updates:
- 17 commands (was 16)
- Review demo showing UX issues (HIERARCHY, NO PRIMARY, DEAD END)
- teach-impeccable in System group of periodic table

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-07 16:56:08 -08:00
2025-11-16 14:54:35 -08:00
2025-12-14 13:55:29 -08:00
2026-01-06 18:49:30 -08:00

Impeccable

The vocabulary you didn't know you needed. 1 skill, 17 commands, and curated anti-patterns for impeccable frontend design.

Quick start: Visit impeccable.style to download ready-to-use bundles.

Why Impeccable?

Anthropic created frontend-design, a skill that guides Claude toward better UI design. Impeccable builds on that foundation with deeper expertise and more control.

Every LLM learned from the same generic templates. Without guidance, you get the same predictable mistakes: Inter font, purple gradients, cards nested in cards, gray text on colored backgrounds.

Impeccable fights that bias with:

  • An expanded skill with 7 domain-specific reference files
  • 15 steering commands to audit, polish, simplify, animate, and more
  • Curated anti-patterns that explicitly tell the AI what NOT to do

What's Included

The Skill: frontend-design

A comprehensive design skill with 7 domain-specific references:

Reference Covers
typography Type systems, font pairing, modular scales, OpenType
color-and-contrast OKLCH, tinted neutrals, dark mode, accessibility
spatial-design Spacing systems, grids, visual hierarchy
motion-design Easing curves, staggering, reduced motion
interaction-design Forms, focus states, loading patterns
responsive-design Mobile-first, fluid design, container queries
ux-writing Button labels, error messages, empty states

17 Commands

Command What it does
/teach-impeccable One-time setup: gather design context, save to config
/audit Run technical quality checks (a11y, performance, responsive)
/review UX design review: hierarchy, clarity, emotional resonance
/normalize Align with design system standards
/polish Final pass before shipping
/simplify Strip to essence
/clarify Improve unclear UX copy
/optimize Performance improvements
/harden Error handling, i18n, edge cases
/animate Add purposeful motion
/colorize Introduce strategic color
/bolder Amplify boring designs
/quieter Tone down overly bold designs
/delight Add moments of joy
/extract Pull into reusable components
/adapt Adapt for different devices
/onboard Design onboarding flows

Anti-Patterns

The skill includes explicit guidance on what to avoid:

  • Don't use overused fonts (Arial, Inter, system defaults)
  • Don't use gray text on colored backgrounds
  • Don't use pure black/gray (always tint)
  • Don't wrap everything in cards or nest cards inside cards
  • Don't use bounce/elastic easing (feels dated)

Installation

Visit impeccable.style, download the ZIP for your tool, and extract to your project.

Option 2: Copy from Repository

Cursor:

cp -r dist/cursor/.cursor your-project/

Claude Code:

# Project-specific
cp -r dist/claude-code/.claude your-project/

# Or global (applies to all projects)
cp -r dist/claude-code/.claude/* ~/.claude/

Gemini CLI:

cp dist/gemini/GEMINI*.md your-project/
cp -r dist/gemini/.gemini/* ~/.gemini/

Codex CLI:

cp -r dist/codex/.codex/* ~/.codex/

Usage

Once installed, use commands in your AI coding tool:

/audit           # Find issues
/normalize       # Fix inconsistencies
/polish          # Final cleanup
/simplify        # Remove complexity

Most commands accept an optional argument to focus on a specific area:

/audit header
/polish checkout-form

Note: Codex CLI uses a different syntax: /prompts:audit, /prompts:polish, etc.

Supported Tools

Contributing

See DEVELOP.md for contributor guidelines and build instructions.

License

Apache 2.0. See LICENSE.

The frontend-design skill builds on Anthropic's original. See NOTICE.md for attribution.


Created by Paul Bakaus

S
Description
No description provided
Readme
378 MiB
Languages
JavaScript 75.7%
Rust 22.1%
Shell 0.9%
Batchfile 0.9%
CSS 0.2%
Other 0.1%