Bruschetta to Seafoam Splashes color palette

B66547Bruschetta 4A468AQueen of the Night Shift 72CC96Vegetation 9498D3Easter Egg 3B261EEthereal Espresso B0EFC3Seafoam Splashes

Open in generator Export PNG, PDF, ASE…

About this palette

Bruschetta to Seafoam Splashes is a 6-color cool, earthy palette: #B66547 (Bruschetta), #4A468A (Queen of the Night Shift), #72CC96 (Vegetation), #9498D3 (Easter Egg), #3B261E (Ethereal Espresso), #B0EFC3 (Seafoam Splashes). It mixes orange, purple, green, brown tones and feels cool overall. The strongest text pairing is #3B261E on #B0EFC3 with a contrast ratio of 10.78:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Bruschetta	rgb(182, 101, 71)	hsl(16, 44%, 50%)
Queen of the Night Shift	rgb(74, 70, 138)	hsl(244, 33%, 41%)
Vegetation	rgb(114, 204, 150)	hsl(144, 47%, 62%)
Easter Egg	rgb(148, 152, 211)	hsl(236, 42%, 70%)
Ethereal Espresso	rgb(59, 38, 30)	hsl(17, 33%, 17%)
Seafoam Splashes	rgb(176, 239, 195)	hsl(138, 66%, 81%)

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.

Aa10.78:1 Very good#3B261E on #B0EFC3
Aa10.78:1 Very good#B0EFC3 on #3B261E
Aa7.28:1 Very good#72CC96 on #3B261E
Aa7.28:1 Very good#3B261E on #72CC96
Aa6.31:1 Good#4A468A on #B0EFC3
Aa6.31:1 Good#B0EFC3 on #4A468A
Aa5.19:1 Good#9498D3 on #3B261E
Aa5.19:1 Good#3B261E on #9498D3

Color blindness preview

CSS variables

/* Bruschetta to Seafoam Splashes — https://swatchly.xyz/palette/b66547-4a468a-72cc96-9498d3-3b261e-b0efc3 */
:root {
  --bruschetta: #b66547;
  --queen-of-the-night-shift: #4a468a;
  --vegetation: #72cc96;
  --easter-egg: #9498d3;
  --ethereal-espresso: #3b261e;
  --seafoam-splashes: #b0efc3;
}

Tailwind CSS v4

/* Bruschetta to Seafoam Splashes — https://swatchly.xyz/palette/b66547-4a468a-72cc96-9498d3-3b261e-b0efc3 */
@theme {
  --color-bruschetta: #b66547;
  --color-bruschetta-50: #fff0eb;
  --color-bruschetta-100: #ffe1d6;
  --color-bruschetta-200: #ffc3ae;
  --color-bruschetta-300: #f2a68a;
  --color-bruschetta-400: #d48264;
  --color-bruschetta-500: #b66547;
  --color-bruschetta-600: #994d30;
  --color-bruschetta-700: #7e3a1f;
  --color-bruschetta-800: #662a13;
  --color-bruschetta-900: #521f0a;
  --color-bruschetta-950: #361104;
  --color-queen-of-the-night-shift: #4a468a;
  --color-queen-of-the-night-shift-50: #f3f4ff;
  --color-queen-of-the-night-shift-100: #e8e9ff;
  --color-queen-of-the-night-shift-200: #d0d2ff;
  --color-queen-of-the-night-shift-300: #b7b7fb;
  --color-queen-of-the-night-shift-400: #9696df;
  --color-queen-of-the-night-shift-500: #7a79c2;
  --color-queen-of-the-night-shift-600: #605ea3;
  --color-queen-of-the-night-shift-700: #4a468a;
  --color-queen-of-the-night-shift-800: #39366c;
  --color-queen-of-the-night-shift-900: #2c2956;
  --color-queen-of-the-night-shift-950: #1a1838;
  --color-vegetation: #72cc96;
  --color-vegetation-50: #cbfedc;
  --color-vegetation-100: #b9f4ce;
  --color-vegetation-200: #9be1b5;
  --color-vegetation-300: #72cc96;
  --color-vegetation-400: #56ad7a;
  --color-vegetation-500: #379361;
  --color-vegetation-600: #1a794a;
  --color-vegetation-700: #006338;
  --color-vegetation-800: #004e2b;
  --color-vegetation-900: #003e21;
  --color-vegetation-950: #002713;
  --color-easter-egg: #9498d3;
  --color-easter-egg-50: #f1f3ff;
  --color-easter-egg-100: #e5e7ff;
  --color-easter-egg-200: #cdd1ff;
  --color-easter-egg-300: #b5b9ee;
  --color-easter-egg-400: #9498d3;
  --color-easter-egg-500: #7a7db6;
  --color-easter-egg-600: #616499;
  --color-easter-egg-700: #4c4e7f;
  --color-easter-egg-800: #3b3c67;
  --color-easter-egg-900: #2d2e52;
  --color-easter-egg-950: #1b1c36;
  --color-ethereal-espresso: #3b261e;
  --color-ethereal-espresso-50: #fff2ed;
  --color-ethereal-espresso-100: #f9e7e0;
  --color-ethereal-espresso-200: #e7d2ca;
  --color-ethereal-espresso-300: #d3bbb2;
  --color-ethereal-espresso-400: #b39a90;
  --color-ethereal-espresso-500: #977d73;
  --color-ethereal-espresso-600: #7a6259;
  --color-ethereal-espresso-700: #604b43;
  --color-ethereal-espresso-800: #4a3831;
  --color-ethereal-espresso-900: #3b261e;
  --color-ethereal-espresso-950: #211713;
  --color-seafoam-splashes: #b0efc3;
  --color-seafoam-splashes-50: #ecfff1;
  --color-seafoam-splashes-100: #d7fbe1;
  --color-seafoam-splashes-200: #b0efc3;
  --color-seafoam-splashes-300: #a1d4b0;
  --color-seafoam-splashes-400: #7bb58d;
  --color-seafoam-splashes-500: #5d9970;
  --color-seafoam-splashes-600: #417c56;
  --color-seafoam-splashes-700: #2d6341;
  --color-seafoam-splashes-800: #1d4e30;
  --color-seafoam-splashes-900: #123c23;
  --color-seafoam-splashes-950: #082614;
}