Agent skill · design visual · aiskillstore
impeccable
Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing pages, dashboards, product UI, app shells, components, forms, settings, onboarding, and empty states. Handles UX review, visual hierarchy, information architecture, cognitive load, accessibility, performance, responsive behavior, theming, anti-patterns, typography, fonts, spacing, layout, alignment, color, motion, micro-interactions, UX copy, error states, edge cases, i18n, and reusable design systems or tokens. Also use for bland designs that need to become bolder or more delightful, loud designs that should become quieter, live browser iteration on UI elements, or ambitious visual effects that should feel technically extraordinary. Not for backend-only or non-UI tasks.
Why this skill is useful
Adds executable scripts for live browser iteration and context-aware design improvements that aren't covered in standard design practices.
What it needs
Requires node installed locally. About 12k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.
What this skill does
Designs and iterates production-grade frontend interfaces. Real working code, committed design choices, exceptional craft. Setup You MUST do these steps before proceeding: 1. Run node .rovodev/skills/impeccable/scripts/context.mjs once per session; if the runtime shows this skill's loaded base directory, run node <skill-base-dir>/scripts/context.mjs instead. Keep cwd/workdir at the user's project, not the skill directory. If the request names or implies a file, route, or app inside a monorepo, infer the concrete path and append --target <path> to the same command. If you've already seen its output in this conversation, do not re-run it. The script either prints the project's PRODUCT.md (and DESIGN.md when present) as a markdown block, or tells you it's missing. Follow whatever it prints. If it reports NOPRODUCTMD: divert into reference/init.md first when the user invoked init, teach, craft, or shape, or when their wording clearly maps to one of those from-scratch build flows (for example: "build/create/make a landing page", "design a new app", or "shape a feature"). Captured product context is the point of those flows. For any other command, a scoped evaluate / refine / enhance / fix / iterate request against existing code, do not divert into init. The existing code is the context: proceed with the requested command, infer the register from the surface in focus (step 4), and offer /impeccable init once as a suggestion the user can take later. A missing PRODUCT.md must never block a scoped request. If the output ends with an UPDATEAVAILABLE directive, follow it (ask the user once about updating, then continue). It never blocks the current task. 2. If the user invoked a sub-command (craft, shape, audit, polish, ...), you MUST read reference/<command>.md next. Non-optional. The reference defines the command's flow; without it you will skip steps the user expects. 3. Familiarize yourself with any existing design system, conventions, and components in the code. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aiskillstore/impeccable