# Spacer

DIGIT Spacer defines a consistent spacing system for the application, providing a set of predefined spacing values that can be applied across different UI elements. This ensures uniformity in layout design and alignment.

## Spacing System

***

DIGIT Spacers provides 12 spacing levels, each corresponding to a predefined pixel value:

| Spacer Name | Value |
| ----------- | ----- |
| spacer1     | 4px   |
| spacer2     | 8px   |
| spacer3     | 12px  |
| spacer4     | 16px  |
| spacer5     | 20px  |
| spacer6     | 24px  |
| spacer7     | 28px  |
| spacer8     | 32px  |
| spacer9     | 36px  |
| spacer10    | 40px  |
| spacer11    | 44px  |
| spacer12    | 48px  |

## Usage Guidelines

***

| <p><strong>Consistent Scaling</strong></p><p>Use predefined spacers instead of arbitrary values to maintain uniformity.</p>                                   | ![](https://3868804918-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FegsIWleSdyH9rMLJ8ShI%2Fuploads%2FMtXXkfi991xQeYqdRdcB%2FConsistent%20Scalings1.png?alt=media\&token=58b0497d-0d88-4385-8b76-66dc3d2499d6) |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| <p><strong>Spacing Hierarchy</strong></p><p>Apply smaller spacers for minor separations (e.g., spacer1 to spacer3) and larger spacers for major divisions</p> | ![](https://3868804918-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FegsIWleSdyH9rMLJ8ShI%2Fuploads%2FPu7relExOaG2gEDPjODM%2FConsistent%20Scaling2.png?alt=media\&token=09fb236c-1c78-4f01-ab0c-2d99d4d73a25)  |
| <p><strong>Avoid Overuse</strong></p><p>Excessive spacing can lead to inefficient use of screen space, reducing visual coherence</p>                          | ![](https://3868804918-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FegsIWleSdyH9rMLJ8ShI%2Fuploads%2FioxtHpCeyU1AOv8Vg6ef%2FAvoid%20Overuses3.png?alt=media\&token=c026ef08-ef3a-4170-9b51-cb25c90cedd9)      |
