# UI Visual Audit > Advanced UI verification using Antigravity Manager's Vision MCP. Use when this capability is needed. - Skill: `tomevault-io/ui-visual-audit` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/ui-visual-audit` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/ui-visual-audit/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: AI & ML - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/ui-visual-audit --- # UI Visual Audit Skill This skill empowers the agent to verify UI implementation against design specs using visual feedback from the Antigravity Manager's built-in Vision MCP. ## Protocol 1. **Capture**: Use the `Vision MCP` to take a screenshot of the current UI (or a specific component). 2. **Analyze**: Compare the screenshot against: - Design tokens (colors, spacing, typography). - Component state (hover, active, focus). - Accessibility requirements (contrast, target sizes). 3. **Report**: Identify discrepancies and provide actionable fix implementation details. ## Patterns - **Theme Check**: `Does the UI follow the Sleek Mid-Century / Bauhaus theme rules?` - **Color Audit**: `Verify that the #FFB800 accent color is used consistently across buttons.` - **UX Layout**: `Check the Bento grid alignment on mobile vs desktop screenshots.` ## Tooling Integration - **Vision MCP**: For screenshots and visual understanding. - **Frontend Design Skill**: For cross-referencing theme principles. - **Arize Phoenix**: For logging visual audit traces. --- > Converted and distributed by [TomeVault](https://tomevault.io/claim/brandonlacoste9-tech) — claim your Tome and manage your conversions.