alignment-text-and-numerics

Community

Align text and numbers for faster scanning.

AuthorHDeibler
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Poor text and numeric alignment forces users to re-read content, makes table comparisons harder, and breaks scannability in forms and dense data displays.

Core Features & Use Cases

  • Text alignment guidance: choose left, right, center, or justified alignment based on context (body copy vs short focal elements vs RTL).
  • Numeric alignment rules: right-align numeric columns and use tabular numerals so digit positions stack cleanly.
  • Form label-input alignment: apply consistent label positioning (top, right-flush/left-flush, or left) to reduce visual re-orientation during scanning.
  • Anti-pattern detection: avoid centered body text, left-aligned numeric columns, inconsistent decimal precision, and unjustified body text without hyphenation.

Quick Start

Apply alignment-text-and-numerics to your UI layout description and ask it to specify the correct alignment choices for each region (body copy, tables with mixed types, and form fields) plus the exact alignment heuristics to follow.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: alignment-text-and-numerics
Download link: https://github.com/HDeibler/universal-design-principles/archive/main.zip#alignment-text-and-numerics

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.