Green Not Found to Caramelise color palette

444500Green Not Found C3D4FFFrozen Periwinkle 606CC3Loch Ness 6E4423Antique Brass D28730Caramelise

About this palette

Green Not Found to Caramelise is a 5-color warm, earthy, vintage palette: #444500 (Green Not Found), #C3D4FF (Frozen Periwinkle), #606CC3 (Loch Ness), #6E4423 (Antique Brass), #D28730 (Caramelise). It mixes brown, blue, purple, orange tones and feels warm overall. The strongest text pairing is #444500 on #C3D4FF with a contrast ratio of 6.76:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Green Not Found	rgb(68, 69, 0)	hsl(61, 100%, 14%)
Frozen Periwinkle	rgb(195, 212, 255)	hsl(223, 100%, 88%)
Loch Ness	rgb(96, 108, 195)	hsl(233, 45%, 57%)
Antique Brass	rgb(110, 68, 35)	hsl(26, 52%, 28%)
Caramelise	rgb(210, 135, 48)	hsl(32, 64%, 51%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa6.76:1 Good#444500 on #C3D4FF
Aa6.76:1 Good#C3D4FF on #444500
Aa5.64:1 Good#C3D4FF on #6E4423
Aa5.64:1 Good#6E4423 on #C3D4FF
Aa3.46:1 Poor#444500 on #D28730
Aa3.46:1 Poor#D28730 on #444500
Aa3.20:1 Poor#C3D4FF on #606CC3
Aa3.20:1 Poor#606CC3 on #C3D4FF

Color blindness preview

CSS variables

/* Green Not Found to Caramelise — https://swatchly.xyz/palette/444500-c3d4ff-606cc3-6e4423-d28730 */
:root {
  --green-not-found: #444500;
  --frozen-periwinkle: #c3d4ff;
  --loch-ness: #606cc3;
  --antique-brass: #6e4423;
  --caramelise: #d28730;
}

Tailwind CSS v4

/* Green Not Found to Caramelise — https://swatchly.xyz/palette/444500-c3d4ff-606cc3-6e4423-d28730 */
@theme {
  --color-green-not-found: #444500;
  --color-green-not-found-50: #f6f9d6;
  --color-green-not-found-100: #ecefc8;
  --color-green-not-found-200: #d9dcae;
  --color-green-not-found-300: #c2c691;
  --color-green-not-found-400: #a3a66b;
  --color-green-not-found-500: #888a4e;
  --color-green-not-found-600: #6d6f34;
  --color-green-not-found-700: #575821;
  --color-green-not-found-800: #444500;
  --color-green-not-found-900: #34350a;
  --color-green-not-found-950: #202103;
  --color-frozen-periwinkle: #c3d4ff;
  --color-frozen-periwinkle-50: #eef3ff;
  --color-frozen-periwinkle-100: #e0e9ff;
  --color-frozen-periwinkle-200: #c3d4ff;
  --color-frozen-periwinkle-300: #b0bee2;
  --color-frozen-periwinkle-400: #909fc6;
  --color-frozen-periwinkle-500: #7584ab;
  --color-frozen-periwinkle-600: #5c6a8f;
  --color-frozen-periwinkle-700: #475475;
  --color-frozen-periwinkle-800: #36415f;
  --color-frozen-periwinkle-900: #29324b;
  --color-frozen-periwinkle-950: #181f30;
  --color-loch-ness: #606cc3;
  --color-loch-ness-50: #f2f5ff;
  --color-loch-ness-100: #e8ecff;
  --color-loch-ness-200: #d1d9ff;
  --color-loch-ness-300: #b6c2ff;
  --color-loch-ness-400: #92a1f7;
  --color-loch-ness-500: #7886df;
  --color-loch-ness-600: #606cc3;
  --color-loch-ness-700: #4a54a3;
  --color-loch-ness-800: #383f86;
  --color-loch-ness-900: #292f6b;
  --color-loch-ness-950: #181c47;
  --color-antique-brass: #6e4423;
  --color-antique-brass-50: #fff2ea;
  --color-antique-brass-100: #ffe6d4;
  --color-antique-brass-200: #f4ceb3;
  --color-antique-brass-300: #dfb596;
  --color-antique-brass-400: #c19372;
  --color-antique-brass-500: #a47755;
  --color-antique-brass-600: #865c3c;
  --color-antique-brass-700: #6e4423;
  --color-antique-brass-800: #56351b;
  --color-antique-brass-900: #432812;
  --color-antique-brass-950: #2b1708;
  --color-caramelise: #d28730;
  --color-caramelise-50: #fff0e1;
  --color-caramelise-100: #ffe1c6;
  --color-caramelise-200: #ffc68d;
  --color-caramelise-300: #efab65;
  --color-caramelise-400: #d28730;
  --color-caramelise-500: #b66d00;
  --color-caramelise-600: #935700;
  --color-caramelise-700: #764500;
  --color-caramelise-800: #5e3500;
  --color-caramelise-900: #4a2900;
  --color-caramelise-950: #301900;
}