Foundation
Spacing
Spacing and dimension tokens used across layouts, components, and breakpoints.
fi-container-size-small
127.6rem · 1276px
fi-container-size-medium
153.6rem · 1536px
fi-container-size-large
176rem · 1760px
fi-container-size-xlarge
192rem · 1920px
fi-heading-xsmall
1.6rem · 16px
fi-heading-small
2rem · 20px
fi-heading-medium
2.4rem · 24px
fi-heading-large
3.2rem · 32px
fi-heading-xlarge
3.6rem · 36px
fi-heading-page-title
4.8rem · 48px
fi-heading-hero-title
6.4rem · 64px
fi-label-tag
1.2rem · 12px
fi-label-small-active
1.4rem · 14px
fi-label-small-default
1.4rem · 14px
fi-label-regular-active
1.6rem · 16px
fi-label-regular-default
1.6rem · 16px
fi-layout-space-gap-tiny
0.4rem · 4px
fi-layout-space-gap-xxxsmall
0.8rem · 8px
fi-layout-space-gap-xxsmall
1.2rem · 12px
fi-layout-space-gap-xsmall
1.6rem · 16px
fi-layout-space-gap-small
2rem · 20px
fi-layout-space-gap-regular
2.4rem · 24px
fi-layout-space-gap-medium
3.2rem · 32px
fi-layout-space-gap-large
4rem · 40px
fi-layout-space-gap-xlarge
4.8rem · 48px
fi-layout-space-gap-xxlarge
5.6rem · 56px
fi-layout-space-gap-xxxlarge
6.4rem · 64px
fi-layout-space-padding-tiny
0.4rem · 4px
fi-layout-space-padding-xxxsmall
0.8rem · 8px
fi-layout-space-padding-xxsmall
1.2rem · 12px
fi-layout-space-padding-xsmall
1.6rem · 16px
fi-layout-space-padding-small
2rem · 20px
fi-layout-space-padding-regular
2.4rem · 24px
fi-layout-space-padding-medium
3.2rem · 32px
fi-layout-space-padding-large
4rem · 40px
fi-layout-space-padding-xlarge
4.8rem · 48px
fi-layout-space-padding-xxlarge
5.6rem · 56px
fi-layout-space-padding-xxxlarge
6.4rem · 64px
fi-layout-space-pattern-action-group-box
2rem · 20px
fi-layout-space-pattern-action-group-mixed
2.4rem · 24px
fi-layout-space-pattern-form-check-gap
1.6rem · 16px
fi-layout-space-pattern-form-field-group-gap
1.6rem · 16px
fi-layout-space-pattern-form-section-heading-margin
1.6rem · 16px
fi-layout-space-pattern-form-field-gap
2.4rem · 24px
fi-layout-space-pattern-form-section-margin
4rem · 40px
fi-layout-space-section-margin-horizontal-large
8rem · 80px
fi-layout-space-section-margin-horizontal-xlarge
8rem · 80px
fi-layout-space-section-margin-horizontal-medium
19.2rem · 192px
fi-layout-space-section-margin-horizontal-small
32.2rem · 322px
fi-layout-space-section-margin-vertical-default
6.4rem · 64px
fi-layout-space-section-margin-vertical-large
11.2rem · 112px
fi-text-tiny
1.2rem · 12px
fi-text-small
1.4rem · 14px
fi-text-regular
1.6rem · 16px
fi-text-large
1.8rem · 18px
fi-text-xlarge
2.4rem · 24px