Codex

Border ​

Border width ​

List of design token names, values and metadata for border-width
NameValue
border-width-base1px

Defined in src/application.json

Refers to dimension.absolute.1

border-width-thick2px

Defined in src/application.json

Refers to dimension.absolute.2

border-width-input-radio--checked6px

Defined in src/components.json

Refers to dimension.absolute.6

Border style ​

List of design token names, values and metadata for border-style
NameValue
border-style-basesolid

Defined in src/application.json

Refers to border-style.100

border-style-dasheddashed

Defined in src/application.json

Refers to border-style.50

Border color ​

List of design token names, values and metadata for border-color
NameValue
border-color-base#a2a9b1

Defined in src/application.json

Refers to color.gray400

border-color-interactive#72777d

Defined in src/application.json

Refers to color.gray500

border-color-disabled#c8ccd1

Defined in src/application.json

Refers to color.gray300

border-color-subtle#c8ccd1

Defined in src/application.json

Refers to color.gray300

border-color-muted#eaecf0

Defined in src/application.json

Refers to color.gray200

border-color-inverted#fff

Defined in src/application.json

Refers to color.white

border-color-progressive#36c

Defined in src/application.json

Refers to color.blue600

border-color-progressive--hover#447ff5

Defined in src/application.json

Refers to color.blue500

border-color-progressive--active#2a4b8d

Defined in src/application.json

Refers to color.blue700

border-color-progressive--focus#36c

Defined in src/application.json

Refers to color.blue600

border-color-destructive#d73333

Defined in src/application.json

Refers to color.red600

border-color-destructive--hover#ff4242

Defined in src/application.json

Refers to color.red500

border-color-destructive--active#b32424

Defined in src/application.json

Refers to color.red700

border-color-destructive--focus#36c

Defined in src/application.json

Refers to color.blue600

border-color-error#b32424

Defined in src/application.json

Refers to color.red700

border-color-error--hover#ff4242

Defined in src/application.json

Refers to color.red500

border-color-warning#a66200

Defined in src/application.json

Refers to color.yellow700

border-color-success#096450

Defined in src/application.json

Refers to color.green700

border-color-notice#54595d

Defined in src/application.json

Refers to color.gray600

border-color-transparenttransparent

Defined in src/application.json

Refers to color.transparent

border-color-divider#a2a9b1

Defined in src/components.json

Refers to color.gray400

border-color-input--hover#72777d

Defined in src/components.json

Refers to border-color.interactive

border-color-input-binary#72777d

Defined in src/components.json

Refers to border-color.interactive

border-color-input-binary--hover#447ff5

Defined in src/components.json

Refers to border-color.progressive--hover

border-color-input-binary--active#2a4b8d

Defined in src/components.json

Refers to border-color.progressive--active

border-color-input-binary--focus#36c

Defined in src/components.json

Refers to border-color.progressive--focus

border-color-input-binary--checked#36c

Defined in src/components.json

Refers to border-color.progressive

Border (shorthand) ​

Note, that only most common shorthands are provided given the number of border-color variants.

List of design token names, values and metadata for border
NameValue
border-base1px solid #a2a9b1

Defined in src/application.json

Refers to border-width.base

Refers to border-style.base

Refers to border-color.base

border-subtle1px solid #c8ccd1

Defined in src/application.json

Refers to border-width.base

Refers to border-style.base

Refers to border-color.subtle

border-progressive1px solid #36c

Defined in src/application.json

Refers to border-width.base

Refers to border-style.base

Refers to border-color.progressive

border-destructive1px solid #d73333

Defined in src/application.json

Refers to border-width.base

Refers to border-style.base

Refers to border-color.destructive

Border radius ​

List of design token names, values and metadata for border-radius
NameValue
border-radius-base2px

Defined in src/application.json

Refers to dimension.absolute.2

border-radius-sharp0

Defined in src/application.json

Refers to dimension.0

border-radius-pill9999px

Defined in src/application.json

Refers to dimension.absolute.9999

border-radius-circle50%

Defined in src/application.json

Refers to dimension.half

Use `50%` for circle or ellipsis. See https://stackoverflow.com/a/29966500