Skip to content

Size

Size

The size tokens are used to define the size of elements, applied for example on the width and height properties.

List of design token names, values and metadata for
NameValue
size-00

Defined in src/application.json

Refers to dimension.0

size-60.0625em

Defined in src/application.json

Refers to dimension.6

Refers to unit.system

size-120.125em

Defined in src/application.json

Refers to dimension.12

Refers to unit.system

size-250.25em

Defined in src/application.json

Refers to dimension.25

Refers to unit.system

size-500.5em

Defined in src/application.json

Refers to dimension.50

Refers to unit.system

size-750.75em

Defined in src/application.json

Refers to dimension.75

Refers to unit.system

size-1001em

Defined in src/application.json

Refers to dimension.100

Refers to unit.system

size-1251.25em

Defined in src/application.json

Refers to dimension.125

Refers to unit.system

size-1501.5em

Defined in src/application.json

Refers to dimension.150

Refers to unit.system

size-2002em

Defined in src/application.json

Refers to dimension.200

Refers to unit.system

size-2502.5em

Defined in src/application.json

Refers to dimension.250

Refers to unit.system

size-2752.75em

Defined in src/application.json

Refers to dimension.275

Refers to unit.system

size-3003em

Defined in src/application.json

Refers to dimension.300

Refers to unit.system

size-4004em

Defined in src/application.json

Refers to dimension.400

Refers to unit.system

size-8008em

Defined in src/application.json

Refers to dimension.800

Refers to unit.system

size-160016em

Defined in src/application.json

Refers to dimension.1600

Refers to unit.system

size-240024em

Defined in src/application.json

Refers to dimension.2400

Refers to unit.system

size-280028em

Defined in src/application.json

Refers to dimension.2800

Refers to unit.system

size-320032em

Defined in src/application.json

Refers to dimension.3200

Refers to unit.system

size-560056em

Defined in src/application.json

Refers to dimension.5600

Refers to unit.system

size-viewport-width-full100vw

Defined in src/application.json

Refers to dimension.viewport.width-full

size-viewport-height-full100vh

Defined in src/application.json

Refers to dimension.viewport.height-full

size-absolute-11px

Defined in src/application.json

Refers to dimension.absolute.1

size-absolute-99999999px

Defined in src/application.json

Refers to dimension.absolute.9999

size-third33.33%

Defined in src/application.json

Refers to dimension.third

size-half50%

Defined in src/application.json

Refers to dimension.half

size-full100%

Defined in src/application.json

Refers to dimension.full

size-double200%

Defined in src/application.json

Refers to dimension.double

size-search-figure2.5em

Defined in src/application.json

Refers to dimension.250

Refers to unit.system

Alias for use in TypeaheadSearch and Thumbnail components for the same purpose and for better code readability.

size-icon-x-small0.75em

Defined in src/components.json

Refers to dimension.75

Refers to unit.system

size-icon-small1em

Defined in src/components.json

Refers to dimension.100

Refers to unit.system

size-icon-medium1.25em

Defined in src/components.json

Refers to dimension.125

Refers to unit.system

Minimum size

List of design token names, values and metadata for
NameValue
min-size-interactive-pointer32px

Defined in src/application.json

Refers to dimension.200

Refers to unit.system

min-size-interactive-touch44px

Defined in src/application.json

Refers to dimension.275

Refers to unit.system

min-size-search-figure40px

Defined in src/application.json

Refers to dimension.250

Refers to unit.system

Alias for use in TypeaheadSearch and Thumbnail components for the same purpose and for better code readability.

min-size-icon-x-small12px

Defined in src/components.json

Refers to dimension.75

Refers to unit.system

min-size-icon-small16px

Defined in src/components.json

Refers to dimension.100

Refers to unit.system

min-size-icon-medium20px

Defined in src/components.json

Refers to dimension.125

Refers to unit.system

min-size-input-binary20px

Defined in src/components.json

Refers to dimension.125

Refers to unit.system

min-size-toggle-switch-grip20px

Defined in src/components.json

Refers to dimension.125

Refers to unit.system

Maximum width

List of design token names, values and metadata for width
NameValue
max-width-basenone

Defined in src/application.json

Refers to max-width.100

max-width-button28em

Defined in src/components.json

Refers to dimension.2800

Refers to unit.system

Note, that this is a slight amendment from WikimediaUI Base from `28.75em` = `460px` to `448px` – `dimension.2800`