Dangerous Affair to Party Pig color palette

D00025Dangerous Affair 009D8DGreen Dynasty 009BEEOut of the Blue 3BB1FFHawaii Morning EDA3FFParty Pig

Open in generator Export PNG, PDF, ASE…

About this palette

Dangerous Affair to Party Pig is a 5-color vibrant, cool palette: #D00025 (Dangerous Affair), #009D8D (Green Dynasty), #009BEE (Out of the Blue), #3BB1FF (Hawaii Morning), #EDA3FF (Party Pig). It mixes red, turquoise, blue, purple tones and feels cool overall. The strongest text pairing is #D00025 on #EDA3FF with a contrast ratio of 3.04:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dangerous Affair	rgb(208, 0, 37)	hsl(349, 100%, 41%)
Green Dynasty	rgb(0, 157, 141)	hsl(174, 100%, 31%)
Out of the Blue	rgb(0, 155, 238)	hsl(201, 100%, 47%)
Hawaii Morning	rgb(59, 177, 255)	hsl(204, 100%, 62%)
Party Pig	rgb(237, 163, 255)	hsl(288, 100%, 82%)

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.

Aa3.04:1 Poor#D00025 on #EDA3FF
Aa3.04:1 Poor#EDA3FF on #D00025

Color blindness preview

CSS variables

/* Dangerous Affair to Party Pig — https://swatchly.xyz/palette/d00025-009d8d-009bee-3bb1ff-eda3ff */
:root {
  --dangerous-affair: #d00025;
  --green-dynasty: #009d8d;
  --out-of-the-blue: #009bee;
  --hawaii-morning: #3bb1ff;
  --party-pig: #eda3ff;
}

Tailwind CSS v4

/* Dangerous Affair to Party Pig — https://swatchly.xyz/palette/d00025-009d8d-009bee-3bb1ff-eda3ff */
@theme {
  --color-dangerous-affair: #d00025;
  --color-dangerous-affair-50: #fff2f0;
  --color-dangerous-affair-100: #ffe5e2;
  --color-dangerous-affair-200: #ffcac5;
  --color-dangerous-affair-300: #ffa8a2;
  --color-dangerous-affair-400: #ff6f6b;
  --color-dangerous-affair-500: #f03941;
  --color-dangerous-affair-600: #d00025;
  --color-dangerous-affair-700: #a7001b;
  --color-dangerous-affair-800: #840013;
  --color-dangerous-affair-900: #68000d;
  --color-dangerous-affair-950: #440005;
  --color-green-dynasty: #009d8d;
  --color-green-dynasty-50: #d8fff8;
  --color-green-dynasty-100: #b9fbef;
  --color-green-dynasty-200: #99ebdd;
  --color-green-dynasty-300: #75d6c7;
  --color-green-dynasty-400: #43b8a8;
  --color-green-dynasty-500: #009d8d;
  --color-green-dynasty-600: #007f71;
  --color-green-dynasty-700: #00645a;
  --color-green-dynasty-800: #004f46;
  --color-green-dynasty-900: #003d36;
  --color-green-dynasty-950: #002621;
  --color-out-of-the-blue: #009bee;
  --color-out-of-the-blue-50: #f1f9ff;
  --color-out-of-the-blue-100: #e3f2ff;
  --color-out-of-the-blue-200: #c2e3ff;
  --color-out-of-the-blue-300: #99d1ff;
  --color-out-of-the-blue-400: #51b5ff;
  --color-out-of-the-blue-500: #009bee;
  --color-out-of-the-blue-600: #007dc1;
  --color-out-of-the-blue-700: #00629a;
  --color-out-of-the-blue-800: #004c79;
  --color-out-of-the-blue-900: #003a5d;
  --color-out-of-the-blue-950: #00233c;
  --color-hawaii-morning: #3bb1ff;
  --color-hawaii-morning-50: #f1f9ff;
  --color-hawaii-morning-100: #e0f1ff;
  --color-hawaii-morning-200: #bce1ff;
  --color-hawaii-morning-300: #8fceff;
  --color-hawaii-morning-400: #3bb1ff;
  --color-hawaii-morning-500: #0593df;
  --color-hawaii-morning-600: #0076b5;
  --color-hawaii-morning-700: #005d90;
  --color-hawaii-morning-800: #004871;
  --color-hawaii-morning-900: #003758;
  --color-hawaii-morning-950: #002238;
  --color-party-pig: #eda3ff;
  --color-party-pig-50: #fdf3ff;
  --color-party-pig-100: #fae5ff;
  --color-party-pig-200: #f4c7ff;
  --color-party-pig-300: #eda3ff;
  --color-party-pig-400: #ca85da;
  --color-party-pig-500: #ae67bf;
  --color-party-pig-600: #904da1;
  --color-party-pig-700: #763785;
  --color-party-pig-800: #5e276b;
  --color-party-pig-900: #4a1b55;
  --color-party-pig-950: #300e38;
}