Start generating

Neptune’s Dream to Plum Highness color palette

0A336ANeptune’s Dream311D00Close but No CigarFFDCAESuch a PeachA56595Bermuda Onion3CC486Magical Malachite84537DPlum Highness
Open in generator Export PNG, PDF, ASE…

About this palette

Neptune’s Dream to Plum Highness is a 6-color warm, vintage palette: #0A336A (Neptune’s Dream), #311D00 (Close but No Cigar), #FFDCAE (Such a Peach), #A56595 (Bermuda Onion), #3CC486 (Magical Malachite), #84537D (Plum Highness). It mixes blue, brown, orange, pink, green tones and feels warm overall. The strongest text pairing is #311D00 on #FFDCAE with a contrast ratio of 12.32:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Neptune’s Dreamrgb(10, 51, 106)hsl(214, 83%, 23%)
Close but No Cigarrgb(49, 29, 0)hsl(36, 100%, 10%)
Such a Peachrgb(255, 220, 174)hsl(34, 100%, 84%)
Bermuda Onionrgb(165, 101, 149)hsl(315, 26%, 52%)
Magical Malachitergb(60, 196, 134)hsl(153, 54%, 50%)
Plum Highnessrgb(132, 83, 125)hsl(309, 23%, 42%)

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.

  • Aa12.32:1 Super#311D00 on #FFDCAE
  • Aa12.32:1 Super#FFDCAE on #311D00
  • Aa9.50:1 Very good#0A336A on #FFDCAE
  • Aa9.50:1 Very good#FFDCAE on #0A336A
  • Aa7.22:1 Very good#311D00 on #3CC486
  • Aa7.22:1 Very good#3CC486 on #311D00
  • Aa5.57:1 Good#0A336A on #3CC486
  • Aa5.57:1 Good#3CC486 on #0A336A

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Neptune’s Dream to Plum Highness — https://swatchly.xyz/palette/0a336a-311d00-ffdcae-a56595-3cc486-84537d */
:root {
  --neptune-s-dream: #0a336a;
  --close-but-no-cigar: #311d00;
  --such-a-peach: #ffdcae;
  --bermuda-onion: #a56595;
  --magical-malachite: #3cc486;
  --plum-highness: #84537d;
}

Tailwind CSS v4

/* Neptune’s Dream to Plum Highness — https://swatchly.xyz/palette/0a336a-311d00-ffdcae-a56595-3cc486-84537d */
@theme {
  --color-neptune-s-dream: #0a336a;
  --color-neptune-s-dream-50: #eff6ff;
  --color-neptune-s-dream-100: #dfecff;
  --color-neptune-s-dream-200: #c0d9ff;
  --color-neptune-s-dream-300: #9cc3fb;
  --color-neptune-s-dream-400: #79a4e1;
  --color-neptune-s-dream-500: #5e88c6;
  --color-neptune-s-dream-600: #456ea9;
  --color-neptune-s-dream-700: #32578d;
  --color-neptune-s-dream-800: #234474;
  --color-neptune-s-dream-900: #0a336a;
  --color-neptune-s-dream-950: #0c213e;
  --color-close-but-no-cigar: #311d00;
  --color-close-but-no-cigar-50: #fff3e5;
  --color-close-but-no-cigar-100: #f9e8d4;
  --color-close-but-no-cigar-200: #e8d4bc;
  --color-close-but-no-cigar-300: #d3bda1;
  --color-close-but-no-cigar-400: #b59d7f;
  --color-close-but-no-cigar-500: #9b8263;
  --color-close-but-no-cigar-600: #80684b;
  --color-close-but-no-cigar-700: #685337;
  --color-close-but-no-cigar-800: #534128;
  --color-close-but-no-cigar-900: #42321d;
  --color-close-but-no-cigar-950: #311d00;
  --color-such-a-peach: #ffdcae;
  --color-such-a-peach-50: #ffeacf;
  --color-such-a-peach-100: #ffdcae;
  --color-such-a-peach-200: #e6cba8;
  --color-such-a-peach-300: #d4b68f;
  --color-such-a-peach-400: #b7976d;
  --color-such-a-peach-500: #9d7d52;
  --color-such-a-peach-600: #83643b;
  --color-such-a-peach-700: #6b5029;
  --color-such-a-peach-800: #553d1b;
  --color-such-a-peach-900: #432e11;
  --color-such-a-peach-950: #2b1c07;
  --color-bermuda-onion: #a56595;
  --color-bermuda-onion-50: #ffeefa;
  --color-bermuda-onion-100: #ffdcf5;
  --color-bermuda-onion-200: #f6c0e7;
  --color-bermuda-onion-300: #e1a5d1;
  --color-bermuda-onion-400: #c382b2;
  --color-bermuda-onion-500: #a56595;
  --color-bermuda-onion-600: #894d7b;
  --color-bermuda-onion-700: #703a63;
  --color-bermuda-onion-800: #5a2b4f;
  --color-bermuda-onion-900: #48203e;
  --color-bermuda-onion-950: #2f1228;
  --color-magical-malachite: #3cc486;
  --color-magical-malachite-50: #e6fff0;
  --color-magical-malachite-100: #c4ffdd;
  --color-magical-malachite-200: #9df2c3;
  --color-magical-malachite-300: #7adfaa;
  --color-magical-malachite-400: #3cc486;
  --color-magical-malachite-500: #00a66a;
  --color-magical-malachite-600: #008555;
  --color-magical-malachite-700: #006a42;
  --color-magical-malachite-800: #005232;
  --color-magical-malachite-900: #003f25;
  --color-magical-malachite-950: #002715;
  --color-plum-highness: #84537d;
  --color-plum-highness-50: #fff0fc;
  --color-plum-highness-100: #ffdff9;
  --color-plum-highness-200: #f0c6e9;
  --color-plum-highness-300: #dcacd4;
  --color-plum-highness-400: #be8ab5;
  --color-plum-highness-500: #a16e99;
  --color-plum-highness-600: #84537d;
  --color-plum-highness-700: #6b4065;
  --color-plum-highness-800: #553050;
  --color-plum-highness-900: #43243f;
  --color-plum-highness-950: #2b1428;
}

Similar palettes