Silent Orbit to Creamy Avocado Color Palette

About this palette

Silent Orbit to Creamy Avocado is a 4-color cool palette: #301847 (Silent Orbit), #227500 (Poblano), #BE88D7 (Dreamy Candy Forest), #CAEFA3 (Creamy Avocado). It mixes purple, green tones and feels cool overall. The strongest text pairing is #301847 on #CAEFA3 with a contrast ratio of 12.16:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Silent Orbit	rgb(48, 24, 71)	hsl(271, 49%, 19%)
Poblano	rgb(34, 117, 0)	hsl(103, 100%, 23%)
Dreamy Candy Forest	rgb(190, 136, 215)	hsl(281, 50%, 69%)
Creamy Avocado	rgb(202, 239, 163)	hsl(89, 70%, 79%)

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.16:1 Super#301847 on #CAEFA3
Aa12.16:1 Super#CAEFA3 on #301847
Aa5.71:1 Good#301847 on #BE88D7
Aa5.71:1 Good#BE88D7 on #301847
Aa4.54:1 Good#227500 on #CAEFA3
Aa4.54:1 Good#CAEFA3 on #227500

Color blindness preview

CSS variables

/* Silent Orbit to Creamy Avocado — https://swatchly.xyz/palette/301847-227500-be88d7-caefa3 */
:root {
  --silent-orbit: #301847;
  --poblano: #227500;
  --dreamy-candy-forest: #be88d7;
  --creamy-avocado: #caefa3;
}

Tailwind CSS v4

/* Silent Orbit to Creamy Avocado — https://swatchly.xyz/palette/301847-227500-be88d7-caefa3 */
@theme {
  --color-silent-orbit: #301847;
  --color-silent-orbit-50: #f8f2ff;
  --color-silent-orbit-100: #f0e6ff;
  --color-silent-orbit-200: #e1cefa;
  --color-silent-orbit-300: #ccb6e8;
  --color-silent-orbit-400: #ad95cb;
  --color-silent-orbit-500: #937ab2;
  --color-silent-orbit-600: #7a6296;
  --color-silent-orbit-700: #644d7e;
  --color-silent-orbit-800: #513c68;
  --color-silent-orbit-900: #412f55;
  --color-silent-orbit-950: #301847;
  --color-poblano: #227500;
  --color-poblano-50: #e2ffdc;
  --color-poblano-100: #c6faba;
  --color-poblano-200: #a9e79b;
  --color-poblano-300: #8ad179;
  --color-poblano-400: #62b04f;
  --color-poblano-500: #42922d;
  --color-poblano-600: #227500;
  --color-poblano-700: #195d00;
  --color-poblano-800: #124900;
  --color-poblano-900: #0c3900;
  --color-poblano-950: #052400;
  --color-dreamy-candy-forest: #be88d7;
  --color-dreamy-candy-forest-50: #faf1ff;
  --color-dreamy-candy-forest-100: #f6e3ff;
  --color-dreamy-candy-forest-200: #edc7ff;
  --color-dreamy-candy-forest-300: #daabf1;
  --color-dreamy-candy-forest-400: #be88d7;
  --color-dreamy-candy-forest-500: #a26dba;
  --color-dreamy-candy-forest-600: #86539c;
  --color-dreamy-candy-forest-700: #6c3e81;
  --color-dreamy-candy-forest-800: #572e68;
  --color-dreamy-candy-forest-900: #442153;
  --color-dreamy-candy-forest-950: #2c1236;
  --color-creamy-avocado: #caefa3;
  --color-creamy-avocado-50: #f6ffed;
  --color-creamy-avocado-100: #e6fcd1;
  --color-creamy-avocado-200: #caefa3;
  --color-creamy-avocado-300: #b6d497;
  --color-creamy-avocado-400: #93b46f;
  --color-creamy-avocado-500: #76974f;
  --color-creamy-avocado-600: #5b7a33;
  --color-creamy-avocado-700: #45611f;
  --color-creamy-avocado-800: #334b0f;
  --color-creamy-avocado-900: #263a06;
  --color-creamy-avocado-950: #162402;
}