audit-layout

Audit layout inconsistencies in codebase and output findings report with file:line citations.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/dthompson-jti/safety-check-app-concept --skill audit-layout
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: audit-layout
Source: https://github.com/dthompson-jti/safety-check-app-concept/tree/main/.agent/skills/audit/layout
Command: npx skills add https://github.com/dthompson-jti/safety-check-app-concept --skill audit-layout

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Audit layout across the codebase to identify spacing, alignment, and grid inconsistencies that degrade visual quality.

Core Features & Use Cases

  • Detect irregular spacing using tokens and gaps
  • Validate alignment and grid usage across sections
  • Generate a findings report with precise file:line citations to guide fixes

Quick Start

Run the audit-layout skill against the codebase to generate a findings report.

Frequently Asked Questions about audit-layout

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

FAQPage Schema
How do I audit layout inconsistencies across my UI codebase?

Running an audit of your UI codebase detects irregular spacing, alignment, and grid usage. It outputs a findings report with precise file:line citations to guide fixes and enforce visual consistency.

What is layout consistency checking in a design system?

Layout consistency checking validates token usage, grid alignment, and margins across UI components. It identifies irregular spacing and gaps that degrade visual quality to enforce design system standards.

When do I need to check spacing and alignment in my codebase?

You need to check spacing and alignment after adding new components, during design reviews, and before releases. This verifies that new code does not introduce grid inconsistencies or irregular margins.

Does the layout audit report show exact file locations for spacing issues?

Yes, the layout audit report outputs exact file:line citations for every detected spacing and alignment issue. This provides precise locations for grid usage and margin problems to guide fixes.

Can I use a layout audit to verify design token usage across components?

Yes, you can use a layout audit to verify design token usage across components. The audit checks token application and detects irregular spacing using gaps to ensure codebase adherence.

What is the best way to find grid alignment problems before a release?

The best way to find grid alignment problems before a release is to run an automated layout audit. It validates grid usage and alignment across sections, outputting a findings report with file:line citations to fix issues.