A design check your AI runs on every change

The check is a fast scan of your code with fixed rules, no AI involved, so it gives the same answer every time.

• Your AI runs it with Xodia's run_check tool, on the files changed since your last save or on the whole site
• Sites opened from your computer with xodia dev run the same check there
• Screenshots your AI takes add live checks on the rendered page: low contrast and long lines, with where each one is in your code
• Xodia's skills tell your AI to run it after every styling change, before it hands the change back to you

Your AI follows Xodia's design skills while it builds, and /xodia:polish starts a finishing pass on a page or component in Claude Code.

• Design directionBefore building, writes a short design brief drawn from your business itself, offers you clear options, and records the one you pick.
• Design systemKeeps typography, spacing and colour consistent through your site's own tokens, so every page looks considered on any screen.
• UI statesDesigns what visitors see while things load, when a list is empty, when something fails or succeeds, and when a control is unavailable.
• PolishA finishing pass over the small details (corners, alignment, shadows, numbers, focus rings, icons) that make a page feel crafted.
• Design critiqueLooks at new or changed pages at three screen sizes, scores how designed they look, fixes the weak spots and looks again.
• AccessibilityMakes pages work for everyone: keyboard, screen readers, readable contrast, sensible headings and named buttons.

The Audits panel checks the page open in the editor, so you catch problems yourself, without asking your AI.

• Images without alt text, headings that skip a level, and links and buttons with no name
• Text contrast, the page title and description, and the page's language
• Each issue shows where it is and which panel fixes it, or send the whole list to your AI in one click