Start generating

Monkey Island to Water Nymph color palette

543C45Monkey Island814E24Milk ChocolateAA6941BourbonB86F7CWatermelon Gelato59B6CBHigh Dive7AD2D7Water Nymph
Open in generator Export PNG, PDF, ASE…

About this palette

Monkey Island to Water Nymph is a 6-color warm, vintage palette: #543C45 (Monkey Island), #814E24 (Milk Chocolate), #AA6941 (Bourbon), #B86F7C (Watermelon Gelato), #59B6CB (High Dive), #7AD2D7 (Water Nymph). It mixes red, brown, orange, turquoise tones and feels warm overall. The strongest text pairing is #543C45 on #7AD2D7 with a contrast ratio of 5.70:1, and 1 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Monkey Islandrgb(84, 60, 69)hsl(338, 17%, 28%)
Milk Chocolatergb(129, 78, 36)hsl(27, 56%, 32%)
Bourbonrgb(170, 105, 65)hsl(23, 45%, 46%)
Watermelon Gelatorgb(184, 111, 124)hsl(349, 34%, 58%)
High Divergb(89, 182, 203)hsl(191, 52%, 57%)
Water Nymphrgb(122, 210, 215)hsl(183, 54%, 66%)

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.

  • Aa5.70:1 Good#543C45 on #7AD2D7
  • Aa5.70:1 Good#7AD2D7 on #543C45
  • Aa4.26:1 Poor#543C45 on #59B6CB
  • Aa4.26:1 Poor#59B6CB on #543C45
  • Aa3.95:1 Poor#814E24 on #7AD2D7
  • Aa3.95:1 Poor#7AD2D7 on #814E24

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Monkey Island to Water Nymph — https://swatchly.xyz/palette/543c45-814e24-aa6941-b86f7c-59b6cb-7ad2d7 */
:root {
  --monkey-island: #543c45;
  --milk-chocolate: #814e24;
  --bourbon: #aa6941;
  --watermelon-gelato: #b86f7c;
  --high-dive: #59b6cb;
  --water-nymph: #7ad2d7;
}

Tailwind CSS v4

/* Monkey Island to Water Nymph — https://swatchly.xyz/palette/543c45-814e24-aa6941-b86f7c-59b6cb-7ad2d7 */
@theme {
  --color-monkey-island: #543c45;
  --color-monkey-island-50: #fff1f6;
  --color-monkey-island-100: #f8e5ec;
  --color-monkey-island-200: #e7d1d8;
  --color-monkey-island-300: #d3b9c2;
  --color-monkey-island-400: #b59aa3;
  --color-monkey-island-500: #9a7e88;
  --color-monkey-island-600: #7f656e;
  --color-monkey-island-700: #664f58;
  --color-monkey-island-800: #543c45;
  --color-monkey-island-900: #402e35;
  --color-monkey-island-950: #291c21;
  --color-milk-chocolate: #814e24;
  --color-milk-chocolate-50: #fff2ea;
  --color-milk-chocolate-100: #ffe6d4;
  --color-milk-chocolate-200: #fbcfaf;
  --color-milk-chocolate-300: #e9b894;
  --color-milk-chocolate-400: #ce9870;
  --color-milk-chocolate-500: #b47d54;
  --color-milk-chocolate-600: #98643b;
  --color-milk-chocolate-700: #814e24;
  --color-milk-chocolate-800: #663c19;
  --color-milk-chocolate-900: #512d0e;
  --color-milk-chocolate-950: #351b05;
  --color-bourbon: #aa6941;
  --color-bourbon-50: #fff0e7;
  --color-bourbon-100: #ffe0cf;
  --color-bourbon-200: #fcc4a4;
  --color-bourbon-300: #e7a985;
  --color-bourbon-400: #c8865f;
  --color-bourbon-500: #aa6941;
  --color-bourbon-600: #8e512b;
  --color-bourbon-700: #753e1a;
  --color-bourbon-800: #5e2f0f;
  --color-bourbon-900: #4b2307;
  --color-bourbon-950: #321502;
  --color-watermelon-gelato: #b86f7c;
  --color-watermelon-gelato-50: #fff2f3;
  --color-watermelon-gelato-100: #ffe4e7;
  --color-watermelon-gelato-200: #ffc7d0;
  --color-watermelon-gelato-300: #f0adb7;
  --color-watermelon-gelato-400: #d48b97;
  --color-watermelon-gelato-500: #b86f7c;
  --color-watermelon-gelato-600: #9a5562;
  --color-watermelon-gelato-700: #7e404c;
  --color-watermelon-gelato-800: #662f3a;
  --color-watermelon-gelato-900: #50222c;
  --color-watermelon-gelato-950: #34131a;
  --color-high-dive: #59b6cb;
  --color-high-dive-50: #eafbff;
  --color-high-dive-100: #d1f6ff;
  --color-high-dive-200: #a8e7f7;
  --color-high-dive-300: #89d3e5;
  --color-high-dive-400: #59b6cb;
  --color-high-dive-500: #3999ad;
  --color-high-dive-600: #117c90;
  --color-high-dive-700: #006373;
  --color-high-dive-800: #004d5a;
  --color-high-dive-900: #003b46;
  --color-high-dive-950: #00242c;
  --color-water-nymph: #7ad2d7;
  --color-water-nymph-50: #dafdff;
  --color-water-nymph-100: #c3f7f9;
  --color-water-nymph-200: #a6e5e8;
  --color-water-nymph-300: #7ad2d7;
  --color-water-nymph-400: #5db1b6;
  --color-water-nymph-500: #3b969b;
  --color-water-nymph-600: #197a7f;
  --color-water-nymph-700: #006266;
  --color-water-nymph-800: #004c50;
  --color-water-nymph-900: #003b3e;
  --color-water-nymph-950: #002527;
}

Similar palettes