Start generating

Maniac Mansion to Water color palette

093F59Maniac Mansion963A02ChocoholicAC754FBrown SugarE1A371Kombucha7DC7EEFish PondD6F1FFWater
Open in generator Export PNG, PDF, ASE…

About this palette

Maniac Mansion to Water is a 6-color vintage palette: #093F59 (Maniac Mansion), #963A02 (Chocoholic), #AC754F (Brown Sugar), #E1A371 (Kombucha), #7DC7EE (Fish Pond), #D6F1FF (Water). It mixes blue, brown, orange, white tones and feels warm overall. The strongest text pairing is #093F59 on #D6F1FF with a contrast ratio of 9.58:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Maniac Mansionrgb(9, 63, 89)hsl(200, 82%, 19%)
Chocoholicrgb(150, 58, 2)hsl(23, 97%, 30%)
Brown Sugarrgb(172, 117, 79)hsl(25, 37%, 49%)
Kombuchargb(225, 163, 113)hsl(27, 65%, 66%)
Fish Pondrgb(125, 199, 238)hsl(201, 77%, 71%)
Waterrgb(214, 241, 255)hsl(200, 100%, 92%)

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.58:1 Very good#093F59 on #D6F1FF
  • Aa9.58:1 Very good#D6F1FF on #093F59
  • Aa6.16:1 Good#963A02 on #D6F1FF
  • Aa6.16:1 Good#D6F1FF on #963A02
  • Aa6.04:1 Good#093F59 on #7DC7EE
  • Aa6.04:1 Good#7DC7EE on #093F59
  • Aa5.18:1 Good#093F59 on #E1A371
  • Aa5.18:1 Good#E1A371 on #093F59

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Maniac Mansion to Water — https://swatchly.xyz/palette/093f59-963a02-ac754f-e1a371-7dc7ee-d6f1ff */
:root {
  --maniac-mansion: #093f59;
  --chocoholic: #963a02;
  --brown-sugar: #ac754f;
  --kombucha: #e1a371;
  --fish-pond: #7dc7ee;
  --water: #d6f1ff;
}

Tailwind CSS v4

/* Maniac Mansion to Water — https://swatchly.xyz/palette/093f59-963a02-ac754f-e1a371-7dc7ee-d6f1ff */
@theme {
  --color-maniac-mansion: #093f59;
  --color-maniac-mansion-50: #ebf7ff;
  --color-maniac-mansion-100: #d7efff;
  --color-maniac-mansion-200: #b8def5;
  --color-maniac-mansion-300: #9dc8e2;
  --color-maniac-mansion-400: #7aaac7;
  --color-maniac-mansion-500: #5f90ad;
  --color-maniac-mansion-600: #467693;
  --color-maniac-mansion-700: #33607a;
  --color-maniac-mansion-800: #254e65;
  --color-maniac-mansion-900: #093f59;
  --color-maniac-mansion-950: #0d2837;
  --color-chocoholic: #963a02;
  --color-chocoholic-50: #fff2ed;
  --color-chocoholic-100: #ffe5da;
  --color-chocoholic-200: #ffccb6;
  --color-chocoholic-300: #ffac88;
  --color-chocoholic-400: #e7885f;
  --color-chocoholic-500: #cc6c40;
  --color-chocoholic-600: #af5225;
  --color-chocoholic-700: #963a02;
  --color-chocoholic-800: #772c00;
  --color-chocoholic-900: #5d2000;
  --color-chocoholic-950: #3d1200;
  --color-brown-sugar: #ac754f;
  --color-brown-sugar-50: #fff2e9;
  --color-brown-sugar-100: #ffe4d3;
  --color-brown-sugar-200: #f9cbae;
  --color-brown-sugar-300: #e6b391;
  --color-brown-sugar-400: #c8916c;
  --color-brown-sugar-500: #ac754f;
  --color-brown-sugar-600: #8f5c37;
  --color-brown-sugar-700: #754725;
  --color-brown-sugar-800: #5e3617;
  --color-brown-sugar-900: #4b280e;
  --color-brown-sugar-950: #301805;
  --color-kombucha: #e1a371;
  --color-kombucha-50: #ffe9d8;
  --color-kombucha-100: #ffd9bb;
  --color-kombucha-200: #f3bf97;
  --color-kombucha-300: #e1a371;
  --color-kombucha-400: #c28756;
  --color-kombucha-500: #a86e3c;
  --color-kombucha-600: #8d5626;
  --color-kombucha-700: #744315;
  --color-kombucha-800: #5f3408;
  --color-kombucha-900: #4d2802;
  --color-kombucha-950: #321700;
  --color-fish-pond: #7dc7ee;
  --color-fish-pond-50: #e5f6ff;
  --color-fish-pond-100: #ceedff;
  --color-fish-pond-200: #a5dcfb;
  --color-fish-pond-300: #7dc7ee;
  --color-fish-pond-400: #61a8cc;
  --color-fish-pond-500: #428db1;
  --color-fish-pond-600: #277295;
  --color-fish-pond-700: #115b7b;
  --color-fish-pond-800: #014864;
  --color-fish-pond-900: #00384f;
  --color-fish-pond-950: #002333;
  --color-water: #d6f1ff;
  --color-water-50: #ebf8ff;
  --color-water-100: #d6f1ff;
  --color-water-200: #c8dce6;
  --color-water-300: #afc5d1;
  --color-water-400: #8ea6b3;
  --color-water-500: #728b97;
  --color-water-600: #58707c;
  --color-water-700: #435964;
  --color-water-800: #33454f;
  --color-water-900: #26353d;
  --color-water-950: #162127;
}

Similar palettes