Verified:GitHub

impeccable

Generates frontend interface designs and enforces quality checks for UX/UI implementation.

Updated Mar 12, 2026

Search Tags:#typography #design systems #ui design #design documentation #ux engineering #responsive adaptation #frontend accessibility

Ready to run

npx skills add https://github.com/mpsuesser/workspace --skill impeccable-mpsuesser

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: impeccable
Source: https://github.com/mpsuesser/workspace/tree/main/dotconfig/pi/agent/skills/impeccable
Command: npx skills add https://github.com/mpsuesser/workspace --skill impeccable-mpsuesser

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires node:fs, node:path, node:url, node:child_process, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

Impeccable produces production-ready frontend UI and design-system work that stays on-brand, consistent, accessible, and implementation-aware instead of drifting into generic or AI-sloppy output.

Core Features & Use Cases

End-to-end UI build flow: shape the UX, confirm visual direction, then implement real components and states.
UX/UI improvement actions: craft, audit, harden, adapt, refine (layout/typography/color/motion), and finalize polish.
Design documentation + extraction: teach from your project context and generate or extract design-system guidance (PRODUCT.md/DESIGN.md) for future consistency.

Quick Start

Run the shape step to confirm what you are building, then implement by telling the skill the feature you want crafted, for example: /impeccable craft "Create the onboarding flow for a new analytics dashboard, including empty, error, and loading states."

Frequently Asked Questions about impeccable

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

FAQPage Schema

How do I generate production-grade UI designs that stay on-brand?▼

Generate production-grade UI designs by loading project context, selecting the correct brand or product register, and applying consistent craft rules across implementation, states, and quality checks to prevent generic or inconsistent output.

What's the best way to document a design system for frontend reuse?▼

Document a design system by extracting guidance from existing project context into structured files like PRODUCT.md or DESIGN.md, ensuring future frontend implementation maintains typography, spacing, and accessibility consistency.

How do I audit frontend accessibility and responsive behavior in a UI component?▼

Audit frontend accessibility and responsive behavior by validating component output against explicit anti-pattern bans and predefined accessibility, performance, and responsiveness constraints during the quality check phase.

Can I build end-to-end UI features with loading, error, and empty states?▼

Yes, you can build end-to-end UI features by shaping the UX, confirming visual direction, and implementing real components that include loading, error, and empty states for comprehensive user interface coverage.

Does this UI design workflow support adapting motion and typography?▼

Yes, the UI design workflow supports refining and adapting layout, typography, color, motion, and copy through iterative improvement actions designed to harden and polish existing frontend interfaces.

Why does my AI-generated frontend UI look generic and inconsistent?▼

AI-generated frontend UI looks generic when it lacks deterministic setup and reference loading; enforcing required workflow gates and applying specific craft rules prevents drifting into inconsistent output.