alignment-text-and-numerics
CommunityAlign text and numbers for faster scanning.
Design & Creative#typography#readability#data tables#form layout#text alignment#numeric columns#tabular numerals
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 requiredComponents
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.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.