SkillsAdd

infrasity-labs/dev-gtm-claude-skills

spacing-system

Create a consistent spacing system based on a base unit with contextual application rules.

First seen Jun 30, 2026

Installation

$ npx skills add infrasity-labs/dev-gtm-claude-skills --skill spacing-system
View on skills.sh ↗ GitHub repository ↗

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

spacing-system Linked neighbor
owl-listener/designer-skills

Create a spacing scale from a base unit with rules for when each step applies. Use when standar…

1.6K installs
apply-consistent-spacing Similar name
gnurio/refactoring-ui-plugin

Use systematic spacing with 25% minimum jumps, start with excess whitespace

139 installs
individual-spacing-algorithm-explainer Similar name
garethmanning/education-agent-skills

Explain and configure individual spacing algorithms using student performance data and forgetti…

109 installs

Also in this package

Other skills from infrasity-labs/dev-gtm-claude-skills · top by installs.

npx skills add infrasity-labs/dev-gtm-claude-skills
llms-txt-checker 116 growth-report 112 brief-outline-generator 111 api-docs-quality-report 111 docs-auditor 110 blog-post-counter 109 sdk-docs-auditor 109 no-outlinks-audit 108 orphan-pages-internal-linking-opportunities 108 analytics 90

Browse all from infrasity-labs/dev-gtm-claude-skills

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Also listed on

Alternate registries and mirrors of this skill.

Repository health

Stars 123
License LICENSE
Default branch main
Open issues 0
Status Active

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 1,329 B
  • docs SUMMARY.md 112 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 54 installs

SKILL.md

Spacing System

You are an expert in creating systematic spacing for consistent, harmonious interfaces.

What You Do

You create spacing systems that bring consistency and rhythm to layouts.

Base Unit

Choose a base unit (typically 4px or 8px) and build a scale:

  • 2xs: 2px
  • xs: 4px
  • sm: 8px
  • md: 16px
  • lg: 24px
  • xl: 32px
  • 2xl: 48px
  • 3xl: 64px

Spacing Types

  • Inset: Padding inside containers (equal or squish/stretch variants)
  • Stack: Vertical space between stacked elements
  • Inline: Horizontal space between inline elements
  • Grid gap: Space between grid/flex items

Application Rules

  • Related items: smaller spacing (sm/md)
  • Distinct sections: larger spacing (lg/xl)
  • Page margins: consistent per breakpoint
  • Component internal: defined per component

Density Modes

  • Compact: reduce spacing by one step (for data-heavy views)
  • Comfortable: default spacing
  • Spacious: increase spacing by one step (for reading-focused)

Best Practices

  • Always use the scale — never arbitrary values
  • Consistent spacing within components
  • Larger gaps between unrelated groups
  • Document spacing intent, not just values
  • Test spacing at different viewport sizes