Look Awesome

Brand

#ffce69 oklch(0.87 0.131 84)

Step	Hex	OKLCH	vs White	vs Black
Base	`#ffce69` Copy	`oklch(0.87 0.131 84)` Copy	1.47:1 fail	14.28:1 AAA
95	`#fff0d4` Copy	`oklch(0.96 0.041 84)` Copy	1.12:1 fail	18.7:1 AAA
90	`#fde2af` Copy	`oklch(0.92 0.072 84)` Copy	1.26:1 fail	16.7:1 AAA
80	`#e9c57e` Copy	`oklch(0.84 0.098 84)` Copy	1.65:1 fail	12.7:1 AAA
70	`#d3a84f` Copy	`oklch(0.75 0.118 84)` Copy	2.21:1 fail	9.5:1 AAA
60	`#bc8e1c` Copy	`oklch(0.67 0.131 84)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#976f00` Copy	`oklch(0.57 0.116 84)` Copy	4.59:1 AA	4.58:1 AA
40	`#735400` Copy	`oklch(0.47 0.096 84)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#5b4100` Copy	`oklch(0.40 0.081 84)` Copy	9.5:1 AAA	2.21:1 fail
20	`#432f00` Copy	`oklch(0.32 0.066 84)` Copy	12.7:1 AAA	1.65:1 fail
10	`#291c00` Copy	`oklch(0.24 0.049 84)` Copy	16.7:1 AAA	1.26:1 fail
05	`#1b1100` Copy	`oklch(0.18 0.038 84)` Copy	18.7:1 AAA	1.12:1 fail

Accent

#ee97cb oklch(0.78 0.122 344)

Step	Hex	OKLCH	vs White	vs Black
Base	`#ee97cb` Copy	`oklch(0.78 0.122 344)` Copy	2.12:1 fail	9.92:1 AAA
95	`#ffedf7` Copy	`oklch(0.96 0.024 344)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ffdcef` Copy	`oklch(0.93 0.047 344)` Copy	1.26:1 fail	16.7:1 AAA
80	`#f9b6dc` Copy	`oklch(0.85 0.092 344)` Copy	1.65:1 fail	12.7:1 AAA
70	`#e496c5` Copy	`oklch(0.77 0.110 344)` Copy	2.21:1 fail	9.5:1 AAA
60	`#ce7aad` Copy	`oklch(0.68 0.122 344)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#ab5a8c` Copy	`oklch(0.58 0.122 344)` Copy	4.59:1 AA	4.58:1 AA
40	`#8b3d6f` Copy	`oklch(0.48 0.122 344)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#702d58` Copy	`oklch(0.41 0.110 344)` Copy	9.5:1 AAA	2.21:1 fail
20	`#541f41` Copy	`oklch(0.33 0.092 344)` Copy	12.7:1 AAA	1.65:1 fail
10	`#351028` Copy	`oklch(0.24 0.067 344)` Copy	16.7:1 AAA	1.26:1 fail
05	`#220919` Copy	`oklch(0.19 0.049 344)` Copy	18.7:1 AAA	1.12:1 fail

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

#fae9f2 oklch(0.95 0.022 344)

Step	Hex	OKLCH	vs White	vs Black
Base	`#fae9f2` Copy	`oklch(0.95 0.022 344)` Copy	1.17:1 fail	18.0:1 AAA
95	`#f7f0f3` Copy	`oklch(0.96 0.009 344)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ece3e8` Copy	`oklch(0.92 0.012 344)` Copy	1.26:1 fail	16.7:1 AAA
80	`#d2c6cc` Copy	`oklch(0.84 0.016 344)` Copy	1.65:1 fail	12.7:1 AAA
70	`#b9abb2` Copy	`oklch(0.75 0.020 344)` Copy	2.21:1 fail	9.5:1 AAA
60	`#a09199` Copy	`oklch(0.67 0.022 344)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#807179` Copy	`oklch(0.57 0.022 344)` Copy	4.59:1 AA	4.58:1 AA
40	`#63555d` Copy	`oklch(0.47 0.022 344)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#4e4249` Copy	`oklch(0.40 0.020 344)` Copy	9.5:1 AAA	2.21:1 fail
20	`#3a3035` Copy	`oklch(0.32 0.016 344)` Copy	12.7:1 AAA	1.65:1 fail
10	`#231c20` Copy	`oklch(0.24 0.012 344)` Copy	16.7:1 AAA	1.26:1 fail
05	`#151113` Copy	`oklch(0.18 0.009 344)` Copy	18.7:1 AAA	1.12:1 fail

Success

#90ac34 oklch(0.70 0.147 122)

Step	Hex	OKLCH	vs White	vs Black
Base	`#90ac34` Copy	`oklch(0.70 0.147 122)` Copy	2.58:1 fail	8.14:1 AAA
95	`#eaf7cc` Copy	`oklch(0.96 0.059 122)` Copy	1.12:1 fail	18.7:1 AAA
90	`#daedb1` Copy	`oklch(0.92 0.081 122)` Copy	1.26:1 fail	16.7:1 AAA
80	`#bbd380` Copy	`oklch(0.83 0.110 122)` Copy	1.65:1 fail	12.7:1 AAA
70	`#9eb953` Copy	`oklch(0.74 0.132 122)` Copy	2.21:1 fail	9.5:1 AAA
60	`#849f23` Copy	`oklch(0.66 0.147 122)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#677e00` Copy	`oklch(0.56 0.134 122)` Copy	4.59:1 AA	4.58:1 AA
40	`#4e6000` Copy	`oklch(0.46 0.111 122)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#3c4b00` Copy	`oklch(0.39 0.094 122)` Copy	9.5:1 AAA	2.21:1 fail
20	`#2c3700` Copy	`oklch(0.32 0.076 122)` Copy	12.7:1 AAA	1.65:1 fail
10	`#192100` Copy	`oklch(0.23 0.056 122)` Copy	16.7:1 AAA	1.26:1 fail
05	`#0f1400` Copy	`oklch(0.18 0.044 122)` Copy	18.7:1 AAA	1.12:1 fail

Warning

#ee7e45 oklch(0.71 0.155 46)

Step	Hex	OKLCH	vs White	vs Black
Base	`#ee7e45` Copy	`oklch(0.71 0.155 46)` Copy	2.73:1 fail	7.71:1 AAA
95	`#ffefe7` Copy	`oklch(0.96 0.021 46)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ffdfd0` Copy	`oklch(0.93 0.041 46)` Copy	1.26:1 fail	16.7:1 AAA
80	`#ffba99` Copy	`oklch(0.84 0.092 46)` Copy	1.65:1 fail	12.7:1 AAA
70	`#fa9462` Copy	`oklch(0.76 0.140 46)` Copy	2.21:1 fail	9.5:1 AAA
60	`#e5763d` Copy	`oklch(0.68 0.155 46)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#c15513` Copy	`oklch(0.58 0.155 46)` Copy	4.59:1 AA	4.58:1 AA
40	`#973e00` Copy	`oklch(0.48 0.135 46)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#782f00` Copy	`oklch(0.40 0.114 46)` Copy	9.5:1 AAA	2.21:1 fail
20	`#5a2100` Copy	`oklch(0.33 0.093 46)` Copy	12.7:1 AAA	1.65:1 fail
10	`#381200` Copy	`oklch(0.24 0.068 46)` Copy	16.7:1 AAA	1.26:1 fail
05	`#260900` Copy	`oklch(0.19 0.054 46)` Copy	18.7:1 AAA	1.12:1 fail

Danger

#e977a4 oklch(0.71 0.148 357)

Step	Hex	OKLCH	vs White	vs Black
Base	`#e977a4` Copy	`oklch(0.71 0.148 357)` Copy	2.75:1 fail	7.64:1 AAA
95	`#ffedf3` Copy	`oklch(0.96 0.021 357)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ffdce8` Copy	`oklch(0.93 0.041 357)` Copy	1.26:1 fail	16.7:1 AAA
80	`#ffb4ce` Copy	`oklch(0.85 0.093 357)` Copy	1.65:1 fail	12.7:1 AAA
70	`#f78eb6` Copy	`oklch(0.77 0.134 357)` Copy	2.21:1 fail	9.5:1 AAA
60	`#e1709d` Copy	`oklch(0.69 0.148 357)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#bd4f7d` Copy	`oklch(0.58 0.148 357)` Copy	4.59:1 AA	4.58:1 AA
40	`#9b3060` Copy	`oklch(0.48 0.148 357)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#7e214c` Copy	`oklch(0.41 0.134 357)` Copy	9.5:1 AAA	2.21:1 fail
20	`#5f1538` Copy	`oklch(0.33 0.111 357)` Copy	12.7:1 AAA	1.65:1 fail
10	`#3c0a21` Copy	`oklch(0.24 0.082 357)` Copy	16.7:1 AAA	1.26:1 fail
05	`#270615` Copy	`oklch(0.19 0.059 357)` Copy	18.7:1 AAA	1.12:1 fail

Light Orange

#ffb66f oklch(0.83 0.122 64)

Step	Hex	OKLCH	vs White	vs Black
Base	`#ffb66f` Copy	`oklch(0.83 0.122 64)` Copy	1.73:1 fail	12.17:1 AAA
95	`#ffefe1` Copy	`oklch(0.96 0.026 64)` Copy	1.12:1 fail	18.7:1 AAA
90	`#ffe0c4` Copy	`oklch(0.92 0.051 64)` Copy	1.26:1 fail	16.7:1 AAA
80	`#f6bf8c` Copy	`oklch(0.84 0.092 64)` Copy	1.65:1 fail	12.7:1 AAA
70	`#e1a163` Copy	`oklch(0.76 0.110 64)` Copy	2.21:1 fail	9.5:1 AAA
60	`#cb863d` Copy	`oklch(0.68 0.122 64)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#a96615` Copy	`oklch(0.57 0.122 64)` Copy	4.59:1 AA	4.58:1 AA
40	`#844c00` Copy	`oklch(0.47 0.107 64)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#683b00` Copy	`oklch(0.40 0.090 64)` Copy	9.5:1 AAA	2.21:1 fail
20	`#4d2a00` Copy	`oklch(0.32 0.074 64)` Copy	12.7:1 AAA	1.65:1 fail
10	`#301800` Copy	`oklch(0.24 0.054 64)` Copy	16.7:1 AAA	1.26:1 fail
05	`#200e00` Copy	`oklch(0.19 0.043 64)` Copy	18.7:1 AAA	1.12:1 fail

Light Blue

#bfe8f5 oklch(0.91 0.046 219)

Step	Hex	OKLCH	vs White	vs Black
Base	`#bfe8f5` Copy	`oklch(0.91 0.046 219)` Copy	1.31:1 fail	16.08:1 AAA
95	`#e4f5fa` Copy	`oklch(0.96 0.018 219)` Copy	1.12:1 fail	18.7:1 AAA
90	`#d3e9f0` Copy	`oklch(0.92 0.025 219)` Copy	1.26:1 fail	16.7:1 AAA
80	`#b0ced8` Copy	`oklch(0.83 0.035 219)` Copy	1.65:1 fail	12.7:1 AAA
70	`#91b4bf` Copy	`oklch(0.75 0.042 219)` Copy	2.21:1 fail	9.5:1 AAA
60	`#749ba7` Copy	`oklch(0.66 0.046 219)` Copy	3.0:1 AA-lg	7.0:1 AAA
50	`#557b87` Copy	`oklch(0.56 0.046 219)` Copy	4.59:1 AA	4.58:1 AA
40	`#395e6a` Copy	`oklch(0.46 0.046 219)` Copy	7.0:1 AAA	3.0:1 AA-lg
30	`#2a4a54` Copy	`oklch(0.39 0.042 219)` Copy	9.5:1 AAA	2.21:1 fail
20	`#1c363e` Copy	`oklch(0.32 0.035 219)` Copy	12.7:1 AAA	1.65:1 fail
10	`#0f2026` Copy	`oklch(0.23 0.025 219)` Copy	16.7:1 AAA	1.26:1 fail
05	`#081417` Copy	`oklch(0.18 0.018 219)` Copy	18.7:1 AAA	1.12:1 fail

Component Preview

Buttons

Brand

Accent

Neutral

Success

Warning

Danger

Named Buttons

Light Orange

Light Blue

Callouts

Saved successfully

Unsaved changes

Cannot delete brand

Badges

Brand

Accent

Neutral

Success

Warning

Danger

Named Badges

Light Orange

Light Blue

Progress & Controls

Notifications

← Key

Key →

Brand

Brand

Accent

Accent

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

Neutral

Success

Success

Warning

Warning

Danger

Danger

Light Orange

Unassigned

Light Blue

Unassigned

Brand

Brand

Accent

Accent

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

Neutral

Success

Success

Warning

Warning

Danger

Danger

Light Orange

Unassigned

Light Blue

Unassigned

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