Design with AI
Use Impeccable to give your AI coding assistant a persistent understanding of your project's visual style
Impeccable is an open-source AI skill that gives your AI coding assistant a professional design vocabulary. Without it, AI tends to produce generic-looking interfaces. With it, the code it generates feels intentional and consistent — because the AI understands your project's fonts, colors, spacing, and component patterns.
It works with Claude Code, Cursor, GitHub Copilot, Gemini CLI, and most other AI coding tools.
Installation
npx skills add pbakaus/impeccableThis installs the Impeccable skill into your project's .claude/skills/ (or equivalent) directory.
One-Time Setup
Run /teach-impeccable once to capture your project's design context:
- Open your AI assistant
- Type
/teach-impeccable - Answer the prompts about your brand colors, typography, spacing, and visual style
- The skill saves your design guidelines to the agent config file
This setup persists across all future sessions — only redo it when your design direction changes significantly.
Design Commands
Impeccable provides 20+ design-focused slash commands:
| Command | Purpose |
|---|---|
/polish | Refine and improve existing UI components |
/audit | Review a component or page for design issues |
/typeset | Improve typography — hierarchy, sizing, spacing |
/overdrive | Push a design further — bolder, more distinctive |
/critique | Score design quality using Nielsen's usability heuristics |
Building Marketing Pages
After setup, use Impeccable commands directly when building or modifying landing page sections. The AI reads your saved design guidelines and produces consistent, intentional UI.
Landing page components live in apps/launchsaas/src/components/landing/. See
the Customization guide for the full
component list.
Example prompts:
Create a new testimonials section for the landing page.
Files are in apps/launchsaas/src/components/landing/.
Match the existing design system.Redesign the hero section to highlight our AI features.
Make it visually distinct while staying consistent with the brand./audit apps/launchsaas/src/components/landing/pricing.tsx/polish the feature cards — improve spacing, typography, and visual hierarchy.Resources
- Impeccable — official site and documentation
- LaunchSaaS Customization — theming, branding, and landing page components