debug-ui-layout

Official

Refine UI copy to avoid orphans and breaks

Authors4wave
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Long UI copy often wraps awkwardly, creating orphaned words and inconsistent line counts across viewports. This Skill provides a repeatable workflow to measure rendering and tune copy for clean, readable layouts.

Core Features & Use Cases

  • Measure rendered line counts and line breaks with the spacewave-debug bridge.
  • Iteratively adjust wording to eliminate orphans and widows and balance lines in responsive layouts.
  • Apply to headings, paragraphs, and captions in web UIs for clearer, more accessible content.

Quick Start

Iteratively tune on-screen copy using the spacewave-debug eval bridge to ensure clean line breaks across viewports.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: debug-ui-layout
Download link: https://github.com/s4wave/spacewave/archive/main.zip#debug-ui-layout

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.