Look Awesome

Brand

#86937f oklch(0.65 0.033 135)

Step	Hex	OKLCH	vs White	vs Black
Base	`#86937f` Copy	`oklch(0.65 0.033 135)` Copy	3.23:1 AA-lg	6.49:1 AA
95	`#eef3eb` Copy	`oklch(0.96 0.013 135)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e0e8dc` Copy	`oklch(0.92 0.018 135)` Copy	1.26:1 fail	16.7:1 AAA
80	`#c2ccbc` Copy	`oklch(0.83 0.025 135)` Copy	1.65:1 fail	12.7:1 AAA
70	`#a6b29f` Copy	`oklch(0.75 0.030 135)` Copy	2.21:1 fail	9.5:1 AAA
60	`#8c9985` Copy	`oklch(0.67 0.033 135)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#6d7966` Copy	`oklch(0.56 0.033 135)` Copy	4.59:1 AA	4.58:1 AA
40	`#515d4a` Copy	`oklch(0.46 0.033 135)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#3e4939` Copy	`oklch(0.39 0.030 135)` Copy	9.5:1 AAA	2.21:1 fail
20	`#2d3528` Copy	`oklch(0.32 0.025 135)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1a2017` Copy	`oklch(0.23 0.018 135)` Copy	16.7:1 AAA	1.26:1 fail
05	`#10130e` Copy	`oklch(0.18 0.013 135)` Copy	18.7:1 AAA	1.12:1 fail

Accent

#9c8795 oklch(0.65 0.032 338)

Step	Hex	OKLCH	vs White	vs Black
Base	`#9c8795` Copy	`oklch(0.65 0.032 338)` Copy	3.33:1 AA-lg	6.31:1 AA
95	`#f9eff5` Copy	`oklch(0.96 0.013 338)` Copy	1.12:1 fail	18.7:1 AAA
90	`#efe2ea` Copy	`oklch(0.92 0.018 338)` Copy	1.26:1 fail	16.7:1 AAA
80	`#d6c5d0` Copy	`oklch(0.84 0.024 338)` Copy	1.65:1 fail	12.7:1 AAA
70	`#bda9b6` Copy	`oklch(0.76 0.029 338)` Copy	2.21:1 fail	9.5:1 AAA
60	`#a48f9d` Copy	`oklch(0.67 0.032 338)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#84707d` Copy	`oklch(0.57 0.032 338)` Copy	4.59:1 AA	4.58:1 AA
40	`#675461` Copy	`oklch(0.47 0.032 338)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#51414c` Copy	`oklch(0.40 0.029 338)` Copy	9.5:1 AAA	2.21:1 fail
20	`#3c2f38` Copy	`oklch(0.32 0.024 338)` Copy	12.7:1 AAA	1.65:1 fail
10	`#241b21` Copy	`oklch(0.24 0.018 338)` Copy	16.7:1 AAA	1.26:1 fail
05	`#171015` Copy	`oklch(0.18 0.013 338)` Copy	18.7:1 AAA	1.12:1 fail

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

#c8d1c4 oklch(0.85 0.020 136)

Step	Hex	OKLCH	vs White	vs Black
Base	`#c8d1c4` Copy	`oklch(0.85 0.020 136)` Copy	1.57:1 fail	13.37:1 AAA
95	`#eff3ee` Copy	`oklch(0.96 0.008 136)` Copy	1.12:1 fail	18.7:1 AAA
90	`#e2e7e0` Copy	`oklch(0.92 0.011 136)` Copy	1.26:1 fail	16.7:1 AAA
80	`#c5cbc2` Copy	`oklch(0.84 0.015 136)` Copy	1.65:1 fail	12.7:1 AAA
70	`#a9b1a6` Copy	`oklch(0.75 0.018 136)` Copy	2.21:1 fail	9.5:1 AAA
60	`#8f978b` Copy	`oklch(0.67 0.020 136)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#70786c` Copy	`oklch(0.56 0.020 136)` Copy	4.59:1 AA	4.58:1 AA
40	`#545b50` Copy	`oklch(0.46 0.020 136)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#41483e` Copy	`oklch(0.39 0.018 136)` Copy	9.5:1 AAA	2.21:1 fail
20	`#2f342d` Copy	`oklch(0.32 0.015 136)` Copy	12.7:1 AAA	1.65:1 fail
10	`#1b1f1a` Copy	`oklch(0.23 0.011 136)` Copy	16.7:1 AAA	1.26:1 fail
05	`#11130f` Copy	`oklch(0.18 0.008 136)` Copy	18.7:1 AAA	1.12:1 fail

Success

#6e9c71 oklch(0.65 0.081 146)

Step	Hex	OKLCH	vs White	vs Black
Base	`#6e9c71` Copy	`oklch(0.65 0.081 146)` Copy	3.15:1 AA-lg	6.66:1 AA
95	`#e4f7e4` Copy	`oklch(0.96 0.032 146)` Copy	1.12:1 fail	18.7:1 AAA
90	`#d2ecd3` Copy	`oklch(0.92 0.044 146)` Copy	1.26:1 fail	16.7:1 AAA
80	`#afd2b0` Copy	`oklch(0.83 0.060 146)` Copy	1.65:1 fail	12.7:1 AAA
70	`#8fb991` Copy	`oklch(0.74 0.073 146)` Copy	2.21:1 fail	9.5:1 AAA
60	`#72a075` Copy	`oklch(0.66 0.081 146)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#538056` Copy	`oklch(0.56 0.081 146)` Copy	4.59:1 AA	4.58:1 AA
40	`#37633b` Copy	`oklch(0.46 0.081 146)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#284e2b` Copy	`oklch(0.38 0.073 146)` Copy	9.5:1 AAA	2.21:1 fail
20	`#1b391e` Copy	`oklch(0.31 0.060 146)` Copy	12.7:1 AAA	1.65:1 fail
10	`#0e2210` Copy	`oklch(0.23 0.044 146)` Copy	16.7:1 AAA	1.26:1 fail
05	`#081509` Copy	`oklch(0.18 0.032 146)` Copy	18.7:1 AAA	1.12:1 fail

Warning

#e1af36 oklch(0.78 0.143 85)

Step	Hex	OKLCH	vs White	vs Black
Base	`#e1af36` Copy	`oklch(0.78 0.143 85)` Copy	2.02:1 fail	10.39:1 AAA
95	`#fff0d2` Copy	`oklch(0.96 0.042 85)` Copy	1.12:1 fail	18.7:1 AAA
90	`#fee2aa` Copy	`oklch(0.92 0.079 85)` Copy	1.26:1 fail	16.7:1 AAA
80	`#eac575` Copy	`oklch(0.84 0.107 85)` Copy	1.65:1 fail	12.7:1 AAA
70	`#d4a842` Copy	`oklch(0.75 0.128 85)` Copy	2.21:1 fail	9.5:1 AAA
60	`#bd8e00` Copy	`oklch(0.67 0.138 85)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#957000` Copy	`oklch(0.57 0.116 85)` Copy	4.59:1 AA	4.58:1 AA
40	`#725400` Copy	`oklch(0.47 0.096 85)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#5a4200` Copy	`oklch(0.39 0.081 85)` Copy	9.5:1 AAA	2.21:1 fail
20	`#423000` Copy	`oklch(0.32 0.066 85)` Copy	12.7:1 AAA	1.65:1 fail
10	`#291c00` Copy	`oklch(0.24 0.049 85)` Copy	16.7:1 AAA	1.26:1 fail
05	`#1a1100` Copy	`oklch(0.18 0.038 85)` Copy	18.7:1 AAA	1.12:1 fail

Danger

#b87f65 oklch(0.65 0.080 45)

Step	Hex	OKLCH	vs White	vs Black
Base	`#b87f65` Copy	`oklch(0.65 0.080 45)` Copy	3.35:1 AA-lg	6.26:1 AA
95	`#ffefe7` Copy	`oklch(0.96 0.021 45)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ffdfd0` Copy	`oklch(0.93 0.041 45)` Copy	1.26:1 fail	16.7:1 AAA
80	`#eebfab` Copy	`oklch(0.84 0.060 45)` Copy	1.65:1 fail	12.7:1 AAA
70	`#d8a38a` Copy	`oklch(0.76 0.072 45)` Copy	2.21:1 fail	9.5:1 AAA
60	`#c1886d` Copy	`oklch(0.68 0.080 45)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#9f684f` Copy	`oklch(0.57 0.080 45)` Copy	4.59:1 AA	4.58:1 AA
40	`#804c33` Copy	`oklch(0.47 0.080 45)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#673a25` Copy	`oklch(0.40 0.072 45)` Copy	9.5:1 AAA	2.21:1 fail
20	`#4d2918` Copy	`oklch(0.32 0.060 45)` Copy	12.7:1 AAA	1.65:1 fail
10	`#30180c` Copy	`oklch(0.24 0.044 45)` Copy	16.7:1 AAA	1.26:1 fail
05	`#1f0e07` Copy	`oklch(0.19 0.032 45)` Copy	18.7:1 AAA	1.12:1 fail

Component Preview

Buttons

Brand

Accent

Neutral

Success

Warning

Danger

Callouts

Saved successfully

Unsaved changes

Cannot delete brand

Badges

Brand

Accent

Neutral

Success

Warning

Danger

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

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