Look Awesome

Brand

#495d7b oklch(0.47 0.055 258)

Step	Hex	OKLCH	vs White	vs Black
Base	`#495d7b` Copy	`oklch(0.47 0.055 258)` Copy	6.7:1 AA	3.14:1 AA-lg
95	`#eaf2ff` Copy	`oklch(0.96 0.019 258)` Copy	1.12:1 fail	18.7:1 AAA
90	`#d9e6fa` Copy	`oklch(0.92 0.030 258)` Copy	1.26:1 fail	16.7:1 AAA
80	`#b9cbe5` Copy	`oklch(0.84 0.041 258)` Copy	1.65:1 fail	12.7:1 AAA
70	`#9cb0ce` Copy	`oklch(0.75 0.049 258)` Copy	2.21:1 fail	9.5:1 AAA
60	`#8196b7` Copy	`oklch(0.67 0.055 258)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#627796` Copy	`oklch(0.56 0.055 258)` Copy	4.59:1 AA	4.58:1 AA
40	`#465a78` Copy	`oklch(0.46 0.055 258)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#354660` Copy	`oklch(0.39 0.049 258)` Copy	9.5:1 AAA	2.21:1 fail
20	`#263348` Copy	`oklch(0.32 0.041 258)` Copy	12.7:1 AAA	1.65:1 fail
10	`#151e2c` Copy	`oklch(0.23 0.030 258)` Copy	16.7:1 AAA	1.26:1 fail
05	`#0c131c` Copy	`oklch(0.18 0.022 258)` Copy	18.7:1 AAA	1.12:1 fail

Accent

#a295c2 oklch(0.70 0.066 298)

Step	Hex	OKLCH	vs White	vs Black
Base	`#a295c2` Copy	`oklch(0.70 0.066 298)` Copy	2.76:1 fail	7.61:1 AAA
95	`#f4f0ff` Copy	`oklch(0.96 0.021 298)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e9e2fc` Copy	`oklch(0.92 0.037 298)` Copy	1.26:1 fail	16.7:1 AAA
80	`#cec4e8` Copy	`oklch(0.84 0.050 298)` Copy	1.65:1 fail	12.7:1 AAA
70	`#b4a8d2` Copy	`oklch(0.76 0.060 298)` Copy	2.21:1 fail	9.5:1 AAA
60	`#9b8ebb` Copy	`oklch(0.68 0.066 298)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#7c6f9a` Copy	`oklch(0.57 0.066 298)` Copy	4.59:1 AA	4.58:1 AA
40	`#5f537b` Copy	`oklch(0.47 0.066 298)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#4b4063` Copy	`oklch(0.40 0.060 298)` Copy	9.5:1 AAA	2.21:1 fail
20	`#372e4a` Copy	`oklch(0.32 0.050 298)` Copy	12.7:1 AAA	1.65:1 fail
10	`#211b2e` Copy	`oklch(0.24 0.037 298)` Copy	16.7:1 AAA	1.26:1 fail
05	`#14101d` Copy	`oklch(0.18 0.027 298)` Copy	18.7:1 AAA	1.12:1 fail

Neutral `0.02` Caps OKLCH Chroma (Saturation). Lower = Grayer.

#efedf5 oklch(0.95 0.011 298)

Step	Hex	OKLCH	vs White	vs Black
Base	`#efedf5` Copy	`oklch(0.95 0.011 298)` Copy	1.16:1 fail	18.1:1 AAA
95	`#f2f1f4` Copy	`oklch(0.96 0.004 298)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e6e5e9` Copy	`oklch(0.92 0.006 298)` Copy	1.26:1 fail	16.7:1 AAA
80	`#cac8ce` Copy	`oklch(0.84 0.008 298)` Copy	1.65:1 fail	12.7:1 AAA
70	`#afadb4` Copy	`oklch(0.75 0.010 298)` Copy	2.21:1 fail	9.5:1 AAA
60	`#96949b` Copy	`oklch(0.67 0.011 298)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#76747b` Copy	`oklch(0.56 0.011 298)` Copy	4.59:1 AA	4.58:1 AA
40	`#5a585f` Copy	`oklch(0.46 0.011 298)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#46454b` Copy	`oklch(0.39 0.010 298)` Copy	9.5:1 AAA	2.21:1 fail
20	`#333237` Copy	`oklch(0.32 0.008 298)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1e1d21` Copy	`oklch(0.24 0.006 298)` Copy	16.7:1 AAA	1.26:1 fail
05	`#121214` Copy	`oklch(0.18 0.004 298)` Copy	18.7:1 AAA	1.12:1 fail

Success

#709f9f oklch(0.67 0.050 196)

Step	Hex	OKLCH	vs White	vs Black
Base	`#709f9f` Copy	`oklch(0.67 0.050 196)` Copy	2.94:1 fail	7.15:1 AAA
95	`#e2f6f5` Copy	`oklch(0.96 0.020 196)` Copy	1.12:1 fail	18.7:1 AAA
90	`#d0eaea` Copy	`oklch(0.92 0.028 196)` Copy	1.26:1 fail	16.7:1 AAA
80	`#acd0d0` Copy	`oklch(0.83 0.038 196)` Copy	1.65:1 fail	12.7:1 AAA
70	`#8cb6b6` Copy	`oklch(0.75 0.045 196)` Copy	2.21:1 fail	9.5:1 AAA
60	`#6e9d9d` Copy	`oklch(0.66 0.050 196)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#4f7d7d` Copy	`oklch(0.56 0.050 196)` Copy	4.59:1 AA	4.58:1 AA
40	`#336061` Copy	`oklch(0.46 0.050 196)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#244c4c` Copy	`oklch(0.39 0.045 196)` Copy	9.5:1 AAA	2.21:1 fail
20	`#173838` Copy	`oklch(0.32 0.038 196)` Copy	12.7:1 AAA	1.65:1 fail
10	`#0b2121` Copy	`oklch(0.23 0.028 196)` Copy	16.7:1 AAA	1.26:1 fail
05	`#061515` Copy	`oklch(0.18 0.020 196)` Copy	18.7:1 AAA	1.12:1 fail

Warning

#bf98a8 oklch(0.72 0.051 352)

Step	Hex	OKLCH	vs White	vs Black
Base	`#bf98a8` Copy	`oklch(0.72 0.051 352)` Copy	2.54:1 fail	8.27:1 AAA
95	`#ffedf4` Copy	`oklch(0.96 0.020 352)` Copy	1.12:1 fail	18.7:1 AAA
90	`#f7dfe8` Copy	`oklch(0.93 0.028 352)` Copy	1.26:1 fail	16.7:1 AAA
80	`#e0c1cd` Copy	`oklch(0.84 0.038 352)` Copy	1.65:1 fail	12.7:1 AAA
70	`#c9a5b3` Copy	`oklch(0.76 0.046 352)` Copy	2.21:1 fail	9.5:1 AAA
60	`#b18b9a` Copy	`oklch(0.68 0.051 352)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#906b7b` Copy	`oklch(0.57 0.051 352)` Copy	4.59:1 AA	4.58:1 AA
40	`#724f5e` Copy	`oklch(0.47 0.051 352)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#5b3d4a` Copy	`oklch(0.40 0.046 352)` Copy	9.5:1 AAA	2.21:1 fail
20	`#432c36` Copy	`oklch(0.32 0.038 352)` Copy	12.7:1 AAA	1.65:1 fail
10	`#291920` Copy	`oklch(0.24 0.028 352)` Copy	16.7:1 AAA	1.26:1 fail
05	`#1a0f14` Copy	`oklch(0.19 0.020 352)` Copy	18.7:1 AAA	1.12:1 fail

Danger

#af869e oklch(0.67 0.060 343)

Step	Hex	OKLCH	vs White	vs Black
Base	`#af869e` Copy	`oklch(0.67 0.060 343)` Copy	3.12:1 AA-lg	6.73:1 AA
95	`#ffedf7` Copy	`oklch(0.96 0.024 343)` Copy	1.12:1 fail	18.7:1 AAA
90	`#f7dfed` Copy	`oklch(0.93 0.033 343)` Copy	1.26:1 fail	16.7:1 AAA
80	`#e1c0d3` Copy	`oklch(0.84 0.045 343)` Copy	1.65:1 fail	12.7:1 AAA
70	`#caa4ba` Copy	`oklch(0.76 0.054 343)` Copy	2.21:1 fail	9.5:1 AAA
60	`#b289a1` Copy	`oklch(0.68 0.060 343)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#916a81` Copy	`oklch(0.57 0.060 343)` Copy	4.59:1 AA	4.58:1 AA
40	`#734e64` Copy	`oklch(0.47 0.060 343)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#5c3c4f` Copy	`oklch(0.40 0.054 343)` Copy	9.5:1 AAA	2.21:1 fail
20	`#442b3a` Copy	`oklch(0.32 0.045 343)` Copy	12.7:1 AAA	1.65:1 fail
10	`#2a1923` Copy	`oklch(0.24 0.033 343)` Copy	16.7:1 AAA	1.26:1 fail
05	`#1a0f16` Copy	`oklch(0.19 0.024 343)` Copy	18.7:1 AAA	1.12:1 fail

Unassigned

#728aad oklch(0.63 0.060 258)

Step	Hex	OKLCH	vs White	vs Black
Base	`#728aad` Copy	`oklch(0.63 0.060 258)` Copy	3.53:1 AA-lg	5.95:1 AA
95	`#eaf3ff` Copy	`oklch(0.96 0.020 258)` Copy	1.12:1 fail	18.7:1 AAA
90	`#d8e7fc` Copy	`oklch(0.92 0.033 258)` Copy	1.26:1 fail	16.7:1 AAA
80	`#b7cbe7` Copy	`oklch(0.84 0.045 258)` Copy	1.65:1 fail	12.7:1 AAA
70	`#99b0d1` Copy	`oklch(0.75 0.054 258)` Copy	2.21:1 fail	9.5:1 AAA
60	`#7e97ba` Copy	`oklch(0.67 0.060 258)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#5f7799` Copy	`oklch(0.56 0.060 258)` Copy	4.59:1 AA	4.58:1 AA
40	`#445a7b` Copy	`oklch(0.46 0.060 258)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#334763` Copy	`oklch(0.39 0.054 258)` Copy	9.5:1 AAA	2.21:1 fail
20	`#24334a` Copy	`oklch(0.32 0.045 258)` Copy	12.7:1 AAA	1.65:1 fail
10	`#141e2d` Copy	`oklch(0.23 0.033 258)` Copy	16.7:1 AAA	1.26:1 fail
05	`#0c131d` Copy	`oklch(0.18 0.024 258)` Copy	18.7:1 AAA	1.12:1 fail

Text Dark

#2d2f3e oklch(0.31 0.027 279)

Step	Hex	OKLCH	vs White	vs Black
Base	`#2d2f3e` Copy	`oklch(0.31 0.027 279)` Copy	13.23:1 AAA	1.59:1 fail
95	`#f0f1f9` Copy	`oklch(0.96 0.011 279)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e3e5f0` Copy	`oklch(0.92 0.015 279)` Copy	1.26:1 fail	16.7:1 AAA
80	`#c6c9d7` Copy	`oklch(0.84 0.020 279)` Copy	1.65:1 fail	12.7:1 AAA
70	`#abaebf` Copy	`oklch(0.75 0.024 279)` Copy	2.21:1 fail	9.5:1 AAA
60	`#9194a6` Copy	`oklch(0.67 0.027 279)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#727586` Copy	`oklch(0.56 0.027 279)` Copy	4.59:1 AA	4.58:1 AA
40	`#565869` Copy	`oklch(0.46 0.027 279)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#434553` Copy	`oklch(0.39 0.024 279)` Copy	9.5:1 AAA	2.21:1 fail
20	`#30323d` Copy	`oklch(0.32 0.020 279)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1c1d25` Copy	`oklch(0.24 0.015 279)` Copy	16.7:1 AAA	1.26:1 fail
05	`#111217` Copy	`oklch(0.18 0.011 279)` Copy	18.7:1 AAA	1.12:1 fail

Text Light

#6c6b7e oklch(0.54 0.029 288)

Step	Hex	OKLCH	vs White	vs Black
Base	`#6c6b7e` Copy	`oklch(0.54 0.029 288)` Copy	5.2:1 AA	4.04:1 AA-lg
95	`#f1f1fa` Copy	`oklch(0.96 0.012 288)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e5e4f0` Copy	`oklch(0.92 0.016 288)` Copy	1.26:1 fail	16.7:1 AAA
80	`#c8c8d8` Copy	`oklch(0.84 0.022 288)` Copy	1.65:1 fail	12.7:1 AAA
70	`#aeadbf` Copy	`oklch(0.75 0.026 288)` Copy	2.21:1 fail	9.5:1 AAA
60	`#9493a7` Copy	`oklch(0.67 0.030 288)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#757487` Copy	`oklch(0.56 0.030 288)` Copy	4.59:1 AA	4.58:1 AA
40	`#58576a` Copy	`oklch(0.47 0.030 288)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#454454` Copy	`oklch(0.39 0.026 288)` Copy	9.5:1 AAA	2.21:1 fail
20	`#32313e` Copy	`oklch(0.32 0.022 288)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1e1d26` Copy	`oklch(0.24 0.016 288)` Copy	16.7:1 AAA	1.26:1 fail
05	`#121217` Copy	`oklch(0.18 0.012 288)` Copy	18.7:1 AAA	1.12:1 fail

Background

#f5f1f2 oklch(0.96 0.004 360)

Step	Hex	OKLCH	vs White	vs Black
Base	`#f5f1f2` Copy	`oklch(0.96 0.004 360)` Copy	1.12:1 fail	18.75:1 AAA
95	`#f3f1f2` Copy	`oklch(0.96 0.002 360)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e7e5e5` Copy	`oklch(0.92 0.002 360)` Copy	1.26:1 fail	16.7:1 AAA
80	`#cbc8c9` Copy	`oklch(0.84 0.003 360)` Copy	1.65:1 fail	12.7:1 AAA
70	`#b1aeae` Copy	`oklch(0.75 0.004 360)` Copy	2.21:1 fail	9.5:1 AAA
60	`#989495` Copy	`oklch(0.67 0.004 360)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#787575` Copy	`oklch(0.56 0.004 360)` Copy	4.59:1 AA	4.58:1 AA
40	`#5c5859` Copy	`oklch(0.46 0.004 360)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#484546` Copy	`oklch(0.39 0.004 360)` Copy	9.5:1 AAA	2.21:1 fail
20	`#343233` Copy	`oklch(0.32 0.003 360)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1f1d1e` Copy	`oklch(0.24 0.002 360)` Copy	16.7:1 AAA	1.26:1 fail
05	`#131212` Copy	`oklch(0.18 0.002 360)` Copy	18.7:1 AAA	1.12:1 fail

Component Preview

Buttons

Brand

Accent

Neutral

Success

Warning

Danger

Named Buttons

Background

Text Dark

Text Light

Callouts

Saved successfully

Unsaved changes

Cannot delete brand

Badges

Brand

Accent

Neutral

Success

Warning

Danger

Named Badges

Background

Text Dark

Text Light

Progress & Controls

Notifications

← Key

Key →

Brand

Brand

Accent

Accent

Neutral · 0.02 Caps OKLCH Chroma (Saturation). Lower = Grayer.

Neutral

Success

Success

Warning

Warning

Danger

Danger

Unassigned

Unassigned

Text Dark

Unassigned

Text Light

Unassigned

Background

Unassigned

Neutral `0.02` Caps OKLCH Chroma (Saturation). Lower = Grayer.