skills.rest
fulfon
fulfonCOMMUNITY
Explore all skills by this author →
GitHub

lusena-spacing-audit

Measure and validate LUSENA page spacing against a JSON specification via playwright-cli.

Updated Jan 30, 2026
Search Tags:#layout#validate#measure#pixel perfect#spacing audit#css bugs
One-click install
npx skills add https://github.com/fulfon/lusena-dawn --skill lusena-spacing-audit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: lusena-spacing-audit
Source: https://github.com/fulfon/lusena-dawn/tree/main/.claude/skills/lusena-spacing-audit
Command: npx skills add https://github.com/fulfon/lusena-dawn --skill lusena-spacing-audit

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the measurement and validation of spacing between all visible elements on a webpage, ensuring adherence to design specifications and detecting common CSS layout bugs.

Core Features & Use Cases

  • Automated Measurement: Measures distances between all visible content elements on a page.
  • Spec Validation: Compares measured values against a JSON specification, reporting pass/fail status.
  • Bug Detection: Auto-detects common CSS spacing issues like unreset margins, off-grid values, and overlaps.
  • Baselining: Captures raw measurements for creating new spacing specifications.
  • Use Case: After updating the CSS for a product page, use this Skill to verify that all spacing remains consistent with the design spec and that no new layout issues have been introduced.

Quick Start

Use the lusena-spacing-audit skill to validate spacing on the homepage desktop.

Frequently Asked Questions about lusena-spacing-audit

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

FAQPage Schema
How do I automate webpage spacing validation against a design spec?▼

Automated spacing validation measures element distances using playwright-cli and compares them against a JSON specification. It reports pass/fail status for padding, margins, and potential layout issues to ensure pixel-perfect adherence.

Can I detect CSS spacing bugs like unreset margins and element overlaps automatically?▼

Yes, automated spacing audits auto-detect common CSS spacing bugs including unreset margins, off-grid values, and element overlaps. It measures visible content elements and provides detailed reports on detected layout issues.

How do I measure distances between all visible elements on a page for a spacing audit?▼

Measuring distances between visible elements is performed via playwright-cli for precise browser interaction. The audit captures raw measurements of element padding and distances, enabling baselining for new spacing specifications.

Does this spacing audit tool require a JSON specification to run?▼

A JSON specification is required for spec validation to compare measured values and report pass/fail status. However, the tool can also capture raw measurements for baselining when creating new spacing specifications from scratch.

What is the best way to verify layout consistency after updating CSS?▼

The best way to verify layout consistency after CSS updates is running an automated spacing audit. It validates that all spacing remains consistent with the design spec and detects if any new layout issues have been introduced.

Related Skills

Explore More Software Engineering Skills→
aresbitaresbit
46

agent-browser

Automate browser navigation, form filling, and data extraction via CLI.

Community
Intermediate
MohammedSaudAlsahliMohammedSaudAlsahli

visual-verdict

Compare generated screenshots with reference images and return JSON pass/fail verdicts.

Community
Advanced
CANTAGESTUDIOCANTAGESTUDIO
3

layout-spacing-checker

Audit CSS/SCSS and SwiftUI layouts for off-scale and inconsistent spacing values.

Community
Intermediate
aquariuscookaquariuscook

visual-testing-advanced

Compare screenshots across viewports and browsers to detect visual regressions.

Community
Advanced