Chilli Con Carne to Eggplant Color Palette

About this palette

Chilli Con Carne to Eggplant is a 5-color cool palette: #A05C00 (Chilli Con Carne), #00577D (Beyond the Sea), #00CF63 (Battletoad), #BCE1FF (Broad Daylight), #45003B (Eggplant). It mixes brown, blue, green, purple tones and feels cool overall. The strongest text pairing is #BCE1FF on #45003B with a contrast ratio of 11.66:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Chilli Con Carne	rgb(160, 92, 0)	hsl(34, 100%, 31%)
Beyond the Sea	rgb(0, 87, 125)	hsl(198, 100%, 25%)
Battletoad	rgb(0, 207, 99)	hsl(149, 100%, 41%)
Broad Daylight	rgb(188, 225, 255)	hsl(207, 100%, 87%)
Eggplant	rgb(69, 0, 59)	hsl(309, 100%, 14%)

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.

Aa11.66:1 Very good#BCE1FF on #45003B
Aa11.66:1 Very good#45003B on #BCE1FF
Aa7.68:1 Very good#00CF63 on #45003B
Aa7.68:1 Very good#45003B on #00CF63
Aa5.77:1 Good#00577D on #BCE1FF
Aa5.77:1 Good#BCE1FF on #00577D
Aa3.81:1 Poor#A05C00 on #BCE1FF
Aa3.81:1 Poor#BCE1FF on #A05C00

Color blindness preview

CSS variables

/* Chilli Con Carne to Eggplant — https://swatchly.xyz/palette/a05c00-00577d-00cf63-bce1ff-45003b */
:root {
  --chilli-con-carne: #a05c00;
  --beyond-the-sea: #00577d;
  --battletoad: #00cf63;
  --broad-daylight: #bce1ff;
  --eggplant: #45003b;
}

Tailwind CSS v4

/* Chilli Con Carne to Eggplant — https://swatchly.xyz/palette/a05c00-00577d-00cf63-bce1ff-45003b */
@theme {
  --color-chilli-con-carne: #a05c00;
  --color-chilli-con-carne-50: #fff3e8;
  --color-chilli-con-carne-100: #ffe7d2;
  --color-chilli-con-carne-200: #ffcea3;
  --color-chilli-con-carne-300: #f3b47a;
  --color-chilli-con-carne-400: #d89250;
  --color-chilli-con-carne-500: #bc762d;
  --color-chilli-con-carne-600: #a05c00;
  --color-chilli-con-carne-700: #804800;
  --color-chilli-con-carne-800: #653800;
  --color-chilli-con-carne-900: #4e2a00;
  --color-chilli-con-carne-950: #321900;
  --color-beyond-the-sea: #00577d;
  --color-beyond-the-sea-50: #ebf7ff;
  --color-beyond-the-sea-100: #d7efff;
  --color-beyond-the-sea-200: #abdeff;
  --color-beyond-the-sea-300: #8cc8ed;
  --color-beyond-the-sea-400: #64a8d0;
  --color-beyond-the-sea-500: #458bb4;
  --color-beyond-the-sea-600: #296f95;
  --color-beyond-the-sea-700: #00577d;
  --color-beyond-the-sea-800: #044461;
  --color-beyond-the-sea-900: #00344d;
  --color-beyond-the-sea-950: #002032;
  --color-battletoad: #00cf63;
  --color-battletoad-50: #edfff0;
  --color-battletoad-100: #d2ffda;
  --color-battletoad-200: #96faae;
  --color-battletoad-300: #6fe891;
  --color-battletoad-400: #00cf63;
  --color-battletoad-500: #00ac51;
  --color-battletoad-600: #008a40;
  --color-battletoad-700: #006d31;
  --color-battletoad-800: #005524;
  --color-battletoad-900: #00401a;
  --color-battletoad-950: #00270d;
  --color-broad-daylight: #bce1ff;
  --color-broad-daylight-50: #f2f9ff;
  --color-broad-daylight-100: #e1f1ff;
  --color-broad-daylight-200: #bce1ff;
  --color-broad-daylight-300: #aac9e1;
  --color-broad-daylight-400: #87a9c4;
  --color-broad-daylight-500: #6a8da8;
  --color-broad-daylight-600: #50718b;
  --color-broad-daylight-700: #3b5971;
  --color-broad-daylight-800: #2b455a;
  --color-broad-daylight-900: #1f3547;
  --color-broad-daylight-950: #11212d;
  --color-eggplant: #45003b;
  --color-eggplant-50: #fff0fb;
  --color-eggplant-100: #ffe1f7;
  --color-eggplant-200: #fdc2ee;
  --color-eggplant-300: #eba8da;
  --color-eggplant-400: #ce86bd;
  --color-eggplant-500: #b36aa3;
  --color-eggplant-600: #975288;
  --color-eggplant-700: #7e3e71;
  --color-eggplant-800: #682f5c;
  --color-eggplant-900: #55234b;
  --color-eggplant-950: #45003b;
}