Border

Design tokens

Border related tokens for color, radius, and width.

Color

border

#bfbfc9

#5b5b66

color

border / color

#8f8f9d

#bfbfc9

interactive

#f0f0f4

#52525e

overlay

#cfcfd8

#3a3944

default

#bac2ca

#5b5b66

deemphasized

rgba(21,20,26,0.1)

rgba(251,251,254,0.1)

card

rgba(0,0,0,0)

rgba(0,0,0,0)

transparent

#0062fa

#00cadb

selected

border / color / interactive

#8f8f9d

#bfbfc9

hover

#8f8f9d

#bfbfc9

active

#8f8f9d

#bfbfc9

disabled

High contrast mode

Windows 11 Desert and Night sky examples:

border

#3d3d3d

#ffffff

color

border / color

#202020

#ffee32

interactive

#3d3d3d

#ffffff

overlay

#3d3d3d

#ffffff

default

#202020

#ffee32

deemphasized

#3d3d3d

#ffffff

card

#3d3d3d

#ffffff

transparent

#903909

#d6b4fd

selected

border / color / interactive

#903909

#d6b4fd

hover

#202020

#ffee32

active

#676767

#a6a6a6

disabled

Radius

border / radius

9999px

9999px

circle

4px

4px

small

8px

8px

medium

16px

16px

large

2px

2px

xsmall

Width

border

1px

1px

width