Icons (7)
About
Global View
16×16
14×14
14×14
14×14
14×14
Colors (6)
Other (5)
Surface (1)
Typography (4)
ui-monospace (3)
AaThe quick brown fox jumps over the lazy dog
ui-monospace1em · w400
AaThe quick brown fox jumps over the lazy dog
ui-monospace.875rem · w400
AaThe quick brown fox jumps over the lazy dog
ui-monospace12px · w400
inherit (1)
AaThe quick brown fox jumps over the lazy dog
inherit100% · winherit
Spacing (32)
Space calc 2px var scaling
calc(-2px * var(--scaling)
Space calc 0px calc 1 var tw space y reverse
calc(0px * calc(1 - var(--tw-space-y-reverse)
Space calc 0px var tw space y reverse
calc(0px * var(--tw-space-y-reverse)
Space .5px
.5px
Space .05em
.05em
Space 1px
1px
Space 2px
2px
Space .125rem
.125rem
Space calc .125rem calc 1 var tw space y reverse
calc(.125rem * calc(1 - var(--tw-space-y-reverse)
Space calc .125rem var tw space y reverse
calc(.125rem * var(--tw-space-y-reverse)
Space 3px
3px
Space .25rem
.25rem
Border Radius (24)
Radius var radius 1var(--radius-1)
Radius var radius 4var(--radius-4)
Radius var radius 5var(--radius-5)
Radius inheritinherit
Radius max var radius 2 var radius fullmax(var(--radius-2),var(--radius-full))
Radius max var radius 3 var radius fullmax(var(--radius-3),var(--radius-full))
Radius max var radius 4 var radius fullmax(var(--radius-4),var(--radius-full))
Radius max var radius 5 var radius fullmax(var(--radius-5),var(--radius-full))
Radius max var radius 6 var radius fullmax(var(--radius-6),var(--radius-full))
Radius max var radius 1 var radius fullmax(var(--radius-1),var(--radius-full))
Radius var radius 3var(--radius-3)
Radius var base card border radiusvar(--base-card-border-radius)
Radius calc var base card border radius var base card border widthcalc(var(--base-card-border-radius) - var(--base-card-border-width))
Radius var skeleton radiusvar(--skeleton-radius)
Radius var checkbox border radiusvar(--checkbox-border-radius)
Radius calc .5px .2em var radius factorcalc((.5px + .2em) * var(--radius-factor))
Radius var radius 2var(--radius-2)
Radius var inset border radius calcvar(--inset-border-radius-calc)
Radius calc var radius factor .35emcalc(var(--radius-factor) * .35em)
Radius calc .07em var radius factorcalc(.07em * var(--radius-factor))
Radius max calc var radius factor var progress height 3 calc var radius factor var radius thumbmax(calc(var(--radius-factor) * var(--progress-height) / 3),calc(var(--radius-factor) * var(--radius-thumb)))
Radius 100%100%
Radius var scrollarea scrollbar border radiusvar(--scrollarea-scrollbar-border-radius)
Radius var segmented control border radiusvar(--segmented-control-border-radius)
Shadows (24)
Shadow 1
Shadow 2
Shadow 3
Shadow 4
Shadow 5
Shadow 6
Shadow 7
Shadow 8
Shadow 9
Shadow 10
Shadow 11
Shadow 12
Shadow 13
Shadow 14
Shadow 15
Shadow 16
Shadow 17
Shadow 18
Shadow 19
Shadow 20
Shadow 21
Shadow 22
Shadow 23
Shadow 24