---
title: "Spacing"
description: "Author General spacing rules so AI-generated layouts breathe the way your brand intends."
label: "Spacing"
date: "2026-06-25"
---

Spacing defines the rhythm between your brand's elements: padding, gaps, and margins. UI Rules serves your spacing guidance to your AI coding tools over MCP, so generated layouts breathe the way your brand intends.

## General rules

The spacing page is built around General rules groups. A rule captures a single guideline, with:

- Text, the guideline itself.
- Guidance: Do, Don't, Caution, or Info.
- Importance: Required, Recommended, or Optional.

Rules live in named groups so related guidance stays together. Use spacing rules to express intent, for example a consistent gap between stacked cards or generous padding inside primary buttons.

<Callout type="info">
Author rules in the composer. Deleted rules go to Trash, where you can restore them. AI Enhance tightens the wording for you.
</Callout>

## Related

For dimensions rather than gaps, see [Sizing](/docs/styles/sizing). For grids and stacks, see [Layout](/docs/styles/layout).