Foundation
Spacing
Spacing and dimension tokens used across layouts, components, and breakpoints.
eu-layout-space-gap-tiny
0.4rem · 4px
eu-layout-space-gap-xxxsmall
0.8rem · 8px
eu-layout-space-gap-xxsmall
1.2rem · 12px
eu-layout-space-gap-xsmall
1.6rem · 16px
eu-layout-space-gap-small
2rem · 20px
eu-layout-space-gap-regular
2.4rem · 24px
eu-layout-space-gap-medium
3.2rem · 32px
eu-layout-space-gap-large
4rem · 40px
eu-layout-space-gap-xlarge
4.8rem · 48px
eu-layout-space-gap-xxlarge
5.6rem · 56px
eu-layout-space-gap-xxxlarge
6.4rem · 64px
eu-layout-space-item-action-group-box
2rem · 20px
eu-layout-space-item-action-group-mixed
2.4rem · 24px
eu-layout-space-item-form-stack-input
4rem · 40px
eu-layout-space-item-form-stack-button
8rem · 80px
eu-layout-space-item-form-stack-heading
8rem · 80px
eu-layout-space-item-form-stack-label
8rem · 80px
eu-layout-space-padding-tiny
0.4rem · 4px
eu-layout-space-padding-xxxsmall
0.8rem · 8px
eu-layout-space-padding-xxsmall
1.2rem · 12px
eu-layout-space-padding-xsmall
1.6rem · 16px
eu-layout-space-padding-small
2rem · 20px
eu-layout-space-padding-regular
2.4rem · 24px
eu-layout-space-padding-medium
3.2rem · 32px
eu-layout-space-padding-large
4rem · 40px
eu-layout-space-padding-xlarge
4.8rem · 48px
eu-layout-space-padding-xxlarge
5.6rem · 56px
eu-layout-space-padding-xxxlarge
6.4rem · 64px
eu-layout-space-section-margin-horizontal-large
8rem · 80px
eu-layout-space-section-margin-horizontal-xlarge
8rem · 80px
eu-layout-space-section-margin-horizontal-medium
19.2rem · 192px
eu-layout-space-section-margin-horizontal-small
32.2rem · 322px
eu-layout-space-section-margin-vertical-default
6.4rem · 64px
eu-layout-space-section-margin-vertical-large
11.2rem · 112px