Temporary — a placeholder page. Alpha does not publish what it describes, so read it as a sketch rather than a reference.

Foundations / Spacing

Spacing

Alpha tokenises corner radius, elevation and motion, and deliberately does not tokenise space. A component owns the room inside it and the application owns the room between them, which is why there is no spacing scale here to reach for.

On this page

Every token that is not a colour or the font

--radius-lgsame in both modes24px
--radius-mdsame in both modes12px
--radius-fullsame in both modes9999px
--shadow-btnsame in both modes0 1px 2px rgba(0, 0, 0, 0.16)
--shadow-softsame in both modes0 4px 20px rgba(0, 0, 0, 0.16)
--shadow-input-insetsame in both modesinset 0 1px 2px rgba(0, 0, 0, 0.25)
--shadow-control-inset-softsame in both modesinset 2px 4px 10px rgba(0, 0, 0, 0.08)
--shadow-control-insetsame in both modesinset 1px 2px 3px rgba(0, 0, 0, 0.15)
--shadow-overlaysame in both modes0 24px 64px rgba(0, 0, 0, 0.24)
--transition-controlsame in both modesfilter 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, translate 0.08s ease

There is no space scale

This is a deliberate omission, stated in tokens.css: components own their internal spacing, and layout spacing belongs to the application. Control heights live in the component stylesheet rather than a shared scale — the button and the dropdown trigger are both 36px, or 52px at size="large", which is what makes them line up in a row. Internal padding is not on a scale either: the button's is tuned per content layout and shifts off-centre when a glyph sits on one side, and the dropdown takes 12px on each side rather than 16 because its chevron already supplies that edge's breathing.

If a scale is introduced it will appear here, read from the same stylesheet as every other value on these pages.