Ultrapurple Merge to Green Revolution color palette

About this palette

Ultrapurple Merge to Green Revolution is a 5-color cool palette: #6447A5 (Ultrapurple Merge), #E2B9FF (Mauve), #C49F00 (Mustard Seed), #3A3300 (Wasabi Nori), #009D3D (Green Revolution). It mixes purple, yellow, brown, green tones and feels cool overall. The strongest text pairing is #E2B9FF on #3A3300 with a contrast ratio of 7.63:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Ultrapurple Mergergb(100, 71, 165)hsl(259, 40%, 46%)
Mauvergb(226, 185, 255)hsl(275, 100%, 86%)
Mustard Seedrgb(196, 159, 0)hsl(49, 100%, 38%)
Wasabi Norirgb(58, 51, 0)hsl(53, 100%, 11%)
Green Revolutionrgb(0, 157, 61)hsl(143, 100%, 31%)

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.

  • Aa7.63:1 Very good#E2B9FF on #3A3300
  • Aa7.63:1 Very good#3A3300 on #E2B9FF
  • Aa5.02:1 Good#C49F00 on #3A3300
  • Aa5.02:1 Good#3A3300 on #C49F00
  • Aa4.22:1 Poor#6447A5 on #E2B9FF
  • Aa4.22:1 Poor#E2B9FF on #6447A5
  • Aa3.56:1 Poor#3A3300 on #009D3D
  • Aa3.56:1 Poor#009D3D on #3A3300

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Ultrapurple Merge to Green Revolution — https://swatchly.xyz/palette/6447a5-e2b9ff-c49f00-3a3300-009d3d */
:root {
  --ultrapurple-merge: #6447a5;
  --mauve: #e2b9ff;
  --mustard-seed: #c49f00;
  --wasabi-nori: #3a3300;
  --green-revolution: #009d3d;
}

Tailwind CSS v4

/* Ultrapurple Merge to Green Revolution — https://swatchly.xyz/palette/6447a5-e2b9ff-c49f00-3a3300-009d3d */
@theme {
  --color-ultrapurple-merge: #6447a5;
  --color-ultrapurple-merge-50: #f5f3ff;
  --color-ultrapurple-merge-100: #ece8ff;
  --color-ultrapurple-merge-200: #dbd2ff;
  --color-ultrapurple-merge-300: #c8b7ff;
  --color-ultrapurple-merge-400: #ac93f3;
  --color-ultrapurple-merge-500: #9277da;
  --color-ultrapurple-merge-600: #795ebd;
  --color-ultrapurple-merge-700: #6447a5;
  --color-ultrapurple-merge-800: #4e3685;
  --color-ultrapurple-merge-900: #3d276a;
  --color-ultrapurple-merge-950: #261647;
  --color-mauve: #e2b9ff;
  --color-mauve-50: #f5e7ff;
  --color-mauve-100: #eed7ff;
  --color-mauve-200: #e2b9ff;
  --color-mauve-300: #cba7e4;
  --color-mauve-400: #ae88c9;
  --color-mauve-500: #956eaf;
  --color-mauve-600: #7b5694;
  --color-mauve-700: #65437b;
  --color-mauve-800: #513364;
  --color-mauve-900: #3f2650;
  --color-mauve-950: #281634;
  --color-mustard-seed: #c49f00;
  --color-mustard-seed-50: #fff6d9;
  --color-mustard-seed-100: #ffebaf;
  --color-mustard-seed-200: #f2d784;
  --color-mustard-seed-300: #dfc05c;
  --color-mustard-seed-400: #c49f00;
  --color-mustard-seed-500: #a38400;
  --color-mustard-seed-600: #846a00;
  --color-mustard-seed-700: #695400;
  --color-mustard-seed-800: #524100;
  --color-mustard-seed-900: #3f3100;
  --color-mustard-seed-950: #281e00;
  --color-wasabi-nori: #3a3300;
  --color-wasabi-nori-50: #faf6db;
  --color-wasabi-nori-100: #f1edcd;
  --color-wasabi-nori-200: #ded9b4;
  --color-wasabi-nori-300: #c8c399;
  --color-wasabi-nori-400: #aaa375;
  --color-wasabi-nori-500: #8e8858;
  --color-wasabi-nori-600: #746d3f;
  --color-wasabi-nori-700: #5c562c;
  --color-wasabi-nori-800: #48431e;
  --color-wasabi-nori-900: #3a3300;
  --color-wasabi-nori-950: #231f08;
  --color-green-revolution: #009d3d;
  --color-green-revolution-50: #ddffe1;
  --color-green-revolution-100: #b7ffc0;
  --color-green-revolution-200: #96eda3;
  --color-green-revolution-300: #72d984;
  --color-green-revolution-400: #40ba5c;
  --color-green-revolution-500: #009d3d;
  --color-green-revolution-600: #007f30;
  --color-green-revolution-700: #006524;
  --color-green-revolution-800: #004f1b;
  --color-green-revolution-900: #003e13;
  --color-green-revolution-950: #002709;
}

Similar palettes