Pallas UI
DocsComponents
Core Concepts
Previews

Spacing & Sizing

Size and spacing tokens definitions used in Pallas UI design system.

Pallas UI uses a consistent sizing and spacing system to ensure proper layout and component proportions.

Control Heights

Small100px x 1.75rem
Medium100px x 2rem
Large100px x 2.5rem

Layout Spacing

Default Layout Spacing

Smallspacing.layout.default.sm
Mediumspacing.layout.default.md
Largespacing.layout.default.lg

Internal Layout Spacing

Smallspacing.layout.internal.sm
Mediumspacing.layout.internal.md
Largespacing.layout.internal.lg

Section Layout Spacing

Smallspacing.layout.section.sm
Mediumspacing.layout.section.md
Largespacing.layout.section.lg

Component Spacing

Gap Component

Smallspacing.gap.component.sm
Mediumspacing.gap.component.md
Largespacing.gap.component.lg

Gap Inline

Extra Smallspacing.gap.inline.xs
Smallspacing.gap.inline.sm
Mediumspacing.gap.inline.md
Largespacing.gap.inline.lg

Padding

Padding Block

Smallspacing.padding.block.sm
Mediumspacing.padding.block.md
Largespacing.padding.block.lg

Padding Inline

Extra Smallspacing.padding.inline.xs
Smallspacing.padding.inline.sm
Mediumspacing.padding.inline.md
Largespacing.padding.inline.lg