Enchanted Glen to Bubblegum Heart color palette

126E3AEnchanted Glen A96200Ginger 003250Beyond the Stars D478D2Pink Orchid FFB9E7Bubblegum Heart

About this palette

Enchanted Glen to Bubblegum Heart is a 5-color cool palette: #126E3A (Enchanted Glen), #A96200 (Ginger), #003250 (Beyond the Stars), #D478D2 (Pink Orchid), #FFB9E7 (Bubblegum Heart). It mixes green, brown, blue, pink tones and feels cool overall. The strongest text pairing is #003250 on #FFB9E7 with a contrast ratio of 8.49:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Enchanted Glen	rgb(18, 110, 58)	hsl(146, 72%, 25%)
Ginger	rgb(169, 98, 0)	hsl(35, 100%, 33%)
Beyond the Stars	rgb(0, 50, 80)	hsl(202, 100%, 16%)
Pink Orchid	rgb(212, 120, 210)	hsl(301, 52%, 65%)
Bubblegum Heart	rgb(255, 185, 231)	hsl(321, 100%, 86%)

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.

Aa8.49:1 Very good#003250 on #FFB9E7
Aa8.49:1 Very good#FFB9E7 on #003250
Aa4.72:1 Good#003250 on #D478D2
Aa4.72:1 Good#D478D2 on #003250
Aa4.02:1 Poor#126E3A on #FFB9E7
Aa4.02:1 Poor#FFB9E7 on #126E3A
Aa3.01:1 Poor#A96200 on #FFB9E7
Aa3.01:1 Poor#FFB9E7 on #A96200

Color blindness preview

CSS variables

/* Enchanted Glen to Bubblegum Heart — https://swatchly.xyz/palette/126e3a-a96200-003250-d478d2-ffb9e7 */
:root {
  --enchanted-glen: #126e3a;
  --ginger: #a96200;
  --beyond-the-stars: #003250;
  --pink-orchid: #d478d2;
  --bubblegum-heart: #ffb9e7;
}

Tailwind CSS v4

/* Enchanted Glen to Bubblegum Heart — https://swatchly.xyz/palette/126e3a-a96200-003250-d478d2-ffb9e7 */
@theme {
  --color-enchanted-glen: #126e3a;
  --color-enchanted-glen-50: #deffe6;
  --color-enchanted-glen-100: #c8fad4;
  --color-enchanted-glen-200: #aeeabe;
  --color-enchanted-glen-300: #92d6a5;
  --color-enchanted-glen-400: #6cb983;
  --color-enchanted-glen-500: #4d9f68;
  --color-enchanted-glen-600: #31854f;
  --color-enchanted-glen-700: #126e3a;
  --color-enchanted-glen-800: #07572b;
  --color-enchanted-glen-900: #00431f;
  --color-enchanted-glen-950: #002b11;
  --color-ginger: #a96200;
  --color-ginger-50: #fff3e8;
  --color-ginger-100: #ffe9d5;
  --color-ginger-200: #ffd1a9;
  --color-ginger-300: #f8b77c;
  --color-ginger-400: #de9751;
  --color-ginger-500: #c47c2e;
  --color-ginger-600: #a96200;
  --color-ginger-700: #874d00;
  --color-ginger-800: #6a3b00;
  --color-ginger-900: #522d00;
  --color-ginger-950: #351b00;
  --color-beyond-the-stars: #003250;
  --color-beyond-the-stars-50: #edf7ff;
  --color-beyond-the-stars-100: #daeeff;
  --color-beyond-the-stars-200: #b9ddf9;
  --color-beyond-the-stars-300: #9ec6e6;
  --color-beyond-the-stars-400: #7aa6c9;
  --color-beyond-the-stars-500: #5d8aad;
  --color-beyond-the-stars-600: #436e8f;
  --color-beyond-the-stars-700: #2f5774;
  --color-beyond-the-stars-800: #20425c;
  --color-beyond-the-stars-900: #003250;
  --color-beyond-the-stars-950: #091e2d;
  --color-pink-orchid: #d478d2;
  --color-pink-orchid-50: #ffeffe;
  --color-pink-orchid-100: #ffdefd;
  --color-pink-orchid-200: #ffbcfc;
  --color-pink-orchid-300: #ef9eed;
  --color-pink-orchid-400: #d478d2;
  --color-pink-orchid-500: #b65db5;
  --color-pink-orchid-600: #994298;
  --color-pink-orchid-700: #7e2e7d;
  --color-pink-orchid-800: #651f65;
  --color-pink-orchid-900: #501450;
  --color-pink-orchid-950: #350935;
  --color-bubblegum-heart: #ffb9e7;
  --color-bubblegum-heart-50: #ffebf7;
  --color-bubblegum-heart-100: #ffdaf2;
  --color-bubblegum-heart-200: #ffb9e7;
  --color-bubblegum-heart-300: #e3a7ce;
  --color-bubblegum-heart-400: #c786b1;
  --color-bubblegum-heart-500: #ab6b97;
  --color-bubblegum-heart-600: #8f537c;
  --color-bubblegum-heart-700: #753f64;
  --color-bubblegum-heart-800: #5f2f50;
  --color-bubblegum-heart-900: #4b223f;
  --color-bubblegum-heart-950: #301328;
}