use-design-system/Spacing
CommunityControl layout spacing with precision.
Authortokijh
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill provides a standardized way to manage vertical and horizontal spacing in your application's layout, ensuring visual consistency and reducing reliance on manual CSS adjustments or Tailwind's gap utilities when explicit spacing elements are needed.
Core Features & Use Cases
- Precise Spacing Control: Define exact spacing sizes using a
sizeprop that maps toremunits. - Directional Spacing: Apply spacing vertically, horizontally, or in both directions.
- Use Case: Use
Spacingto add consistent margins between sections of a page or between items in a flex container where directgapproperties might be less suitable or overrideable.
Quick Start
Add a vertical space of 1.5rem between two components using the Spacing component.
Dependency Matrix
Required Modules
None requiredComponents
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: use-design-system/Spacing Download link: https://github.com/tokijh/minapp/archive/main.zip#use-design-system-spacing 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 223,000+ vetted skills library on demand.