Start generating

Salvia to Monkey Island color palette

A0BB9ESalvia11272DBlack Box8B7384Muted Berry855854Wild WestD5C9D7Light Lilac563E3AMonkey Island
Open in generator Export PNG, PDF, ASE…

About this palette

Salvia to Monkey Island is a 6-color muted palette: #A0BB9E (Salvia), #11272D (Black Box), #8B7384 (Muted Berry), #855854 (Wild West), #D5C9D7 (Light Lilac), #563E3A (Monkey Island). It mixes green, gray, pink, red tones and feels warm overall. The strongest text pairing is #11272D on #D5C9D7 with a contrast ratio of 9.74:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Salviargb(160, 187, 158)hsl(116, 18%, 68%)
Black Boxrgb(17, 39, 45)hsl(193, 45%, 12%)
Muted Berryrgb(139, 115, 132)hsl(317, 9%, 50%)
Wild Westrgb(133, 88, 84)hsl(5, 23%, 43%)
Light Lilacrgb(213, 201, 215)hsl(291, 15%, 82%)
Monkey Islandrgb(86, 62, 58)hsl(9, 19%, 28%)

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.

  • Aa9.74:1 Very good#11272D on #D5C9D7
  • Aa9.74:1 Very good#D5C9D7 on #11272D
  • Aa7.47:1 Very good#A0BB9E on #11272D
  • Aa7.47:1 Very good#11272D on #A0BB9E
  • Aa6.14:1 Good#D5C9D7 on #563E3A
  • Aa6.14:1 Good#563E3A on #D5C9D7
  • Aa4.71:1 Good#A0BB9E on #563E3A
  • Aa4.71:1 Good#563E3A on #A0BB9E

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Salvia to Monkey Island — https://swatchly.xyz/palette/a0bb9e-11272d-8b7384-855854-d5c9d7-563e3a */
:root {
  --salvia: #a0bb9e;
  --black-box: #11272d;
  --muted-berry: #8b7384;
  --wild-west: #855854;
  --light-lilac: #d5c9d7;
  --monkey-island: #563e3a;
}

Tailwind CSS v4

/* Salvia to Monkey Island — https://swatchly.xyz/palette/a0bb9e-11272d-8b7384-855854-d5c9d7-563e3a */
@theme {
  --color-salvia: #a0bb9e;
  --color-salvia-50: #e2f3e1;
  --color-salvia-100: #d4e7d3;
  --color-salvia-200: #bcd2ba;
  --color-salvia-300: #a0bb9e;
  --color-salvia-400: #849e82;
  --color-salvia-500: #6c856a;
  --color-salvia-600: #556d53;
  --color-salvia-700: #425841;
  --color-salvia-800: #334632;
  --color-salvia-900: #273826;
  --color-salvia-950: #172316;
  --color-black-box: #11272d;
  --color-black-box-50: #eaf8fd;
  --color-black-box-100: #deeff3;
  --color-black-box-200: #c8dbe1;
  --color-black-box-300: #afc5cc;
  --color-black-box-400: #8ea6ad;
  --color-black-box-500: #738c93;
  --color-black-box-600: #5a7279;
  --color-black-box-700: #465c62;
  --color-black-box-800: #36494f;
  --color-black-box-900: #293a3e;
  --color-black-box-950: #11272d;
  --color-muted-berry: #8b7384;
  --color-muted-berry-50: #fdeef9;
  --color-muted-berry-100: #f3e1ed;
  --color-muted-berry-200: #dfcbd9;
  --color-muted-berry-300: #c8b1c1;
  --color-muted-berry-400: #a890a1;
  --color-muted-berry-500: #8b7384;
  --color-muted-berry-600: #725b6b;
  --color-muted-berry-700: #5b4856;
  --color-muted-berry-800: #493744;
  --color-muted-berry-900: #392b35;
  --color-muted-berry-950: #251a22;
  --color-wild-west: #855854;
  --color-wild-west-50: #fff2f0;
  --color-wild-west-100: #ffe2df;
  --color-wild-west-200: #f2cac6;
  --color-wild-west-300: #deb1ad;
  --color-wild-west-400: #bf8f8b;
  --color-wild-west-500: #a2736f;
  --color-wild-west-600: #855854;
  --color-wild-west-700: #6b4441;
  --color-wild-west-800: #563431;
  --color-wild-west-900: #442725;
  --color-wild-west-950: #2c1715;
  --color-light-lilac: #d5c9d7;
  --color-light-lilac-50: #f3ecf4;
  --color-light-lilac-100: #e8e0e9;
  --color-light-lilac-200: #d5c9d7;
  --color-light-lilac-300: #bfb5c1;
  --color-light-lilac-400: #a297a4;
  --color-light-lilac-500: #887d8a;
  --color-light-lilac-600: #6f6571;
  --color-light-lilac-700: #5a505b;
  --color-light-lilac-800: #473f49;
  --color-light-lilac-900: #373038;
  --color-light-lilac-950: #221d23;
  --color-monkey-island: #563e3a;
  --color-monkey-island-50: #fff2ef;
  --color-monkey-island-100: #f9e6e3;
  --color-monkey-island-200: #e8d2ce;
  --color-monkey-island-300: #d4bbb6;
  --color-monkey-island-400: #b69b97;
  --color-monkey-island-500: #9b807b;
  --color-monkey-island-600: #806662;
  --color-monkey-island-700: #68514d;
  --color-monkey-island-800: #563e3a;
  --color-monkey-island-900: #41302d;
  --color-monkey-island-950: #2a1d1b;
}

Similar palettes