Design System

Size atom

Atomic Components

The size atom describes the dimensions of a component. It is more of a property than an object and applies to Texts, Text Fields, Buttons, Radio Buttons, and Checkboxes.

3 preset sizes

3 preset sizes

JSON

Component size is not a JSON object, it’s just a property.

It’s a string with this list as possible values:

"small"
"medium"
"large"

Rules

Usually the default value is small

Only some components can receive the Atom Size: Texts, TextFields, Buttons, Radio Buttons and CheckBoxes.

The Atom Size can be applied independently on these elements or group of elements ::

  • Texts

  • Forms → made up of Texts, Text Fields, Radio Buttons and CheckBoxes

  • Buttons

Example