av Muhammad Rizqinovniari 4 dager siden
20
Mer som dette
color (property, variant, scale, state)
Property : Icon, Text, Background, Stroke
Variant : Primary, Secondary, Neutral, Danger, Info, Warning
Scale : Subtle, Bolder
State : Hover, Active
dark = 600
lightdark = 500
light = 200
white = 0
Button = 300
dark = 600
lightdark = 500
light = 100
white = 0
bolder = 400
Middle
300
200
bolder = 600
Subtle
100
Disable
Disable
turun 50% opacity colornya
Hover
Hover = +100
success, secondary, danger, info, warning itu = 500
dark = 600
lightdark = 500
light = 400
white = 0
Bolder
0
400
500
600
utk transparant background
background dark 80%
shadow component
0,0,10,-2
0,0,15,2
x,y,blur,spread
0, 4, 10, 0
x,y,blur,spread
0, 8,15, 0
x,y,blur,spread
0, -4, 10, 0
x,y,blur,spread
0, -8,15, 0
x,y,blur,spread
4, 0,10, 0
x,y,blur,spread
8, 0,15, 0
black #000000
opacity 15
x,y,blur,spread
-4, 0, 10, 0
x, y, blur, spread
-8, 0,15, 0
Category (variant,scale,state)
Font (subheading, h7, capital)
capital
sm = 5
md = 10
lg = 20
xl = 30
rd = 9999
5
10
20
30
9999
2xs = 4
xs = 8
sm =12
md = 16
lg = 24
xl =32
2xl = 40
3xl = 48
4xl = 64
5xl = 80
4
8
12
16
24
32
40
48
64
80
