Nightly Activities to New Love Color Palette

About this palette

Nightly Activities to New Love is a 4-color cool, monochromatic, gradient palette: #33528D (Nightly Activities), #6074A9 (Endless River), #8E96C6 (Easter Egg), #BEB9E2 (New Love). It mixes blue, purple tones and feels cool overall. The strongest text pairing is #33528D on #BEB9E2 with a contrast ratio of 4.11:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Nightly Activities	rgb(51, 82, 141)	hsl(219, 47%, 38%)
Endless River	rgb(96, 116, 169)	hsl(224, 30%, 52%)
Easter Egg	rgb(142, 150, 198)	hsl(231, 33%, 67%)
New Love	rgb(190, 185, 226)	hsl(247, 41%, 81%)

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.

Aa4.11:1 Poor#33528D on #BEB9E2
Aa4.11:1 Poor#BEB9E2 on #33528D

Color blindness preview

CSS variables

/* Nightly Activities to New Love — https://swatchly.xyz/palette/33528d-6074a9-8e96c6-beb9e2 */
:root {
  --nightly-activities: #33528d;
  --endless-river: #6074a9;
  --easter-egg: #8e96c6;
  --new-love: #beb9e2;
}

Tailwind CSS v4

/* Nightly Activities to New Love — https://swatchly.xyz/palette/33528d-6074a9-8e96c6-beb9e2 */
@theme {
  --color-nightly-activities: #33528d;
  --color-nightly-activities-50: #f0f5ff;
  --color-nightly-activities-100: #e1ecff;
  --color-nightly-activities-200: #c2d8ff;
  --color-nightly-activities-300: #a1c1fb;
  --color-nightly-activities-400: #7fa1df;
  --color-nightly-activities-500: #6285c4;
  --color-nightly-activities-600: #4a6aa5;
  --color-nightly-activities-700: #33528d;
  --color-nightly-activities-800: #27406f;
  --color-nightly-activities-900: #1c3158;
  --color-nightly-activities-950: #0f1e3a;
  --color-endless-river: #6074a9;
  --color-endless-river-50: #f1f5ff;
  --color-endless-river-100: #e6edff;
  --color-endless-river-200: #ccdbff;
  --color-endless-river-300: #b2c6f6;
  --color-endless-river-400: #93a7dd;
  --color-endless-river-500: #788dc4;
  --color-endless-river-600: #6074a9;
  --color-endless-river-700: #495b8c;
  --color-endless-river-800: #374771;
  --color-endless-river-900: #28355a;
  --color-endless-river-950: #17213b;
  --color-easter-egg: #8e96c6;
  --color-easter-egg-50: #eff1ff;
  --color-easter-egg-100: #e0e5ff;
  --color-easter-egg-200: #c8cff7;
  --color-easter-egg-300: #afb7e3;
  --color-easter-egg-400: #8e96c6;
  --color-easter-egg-500: #757cab;
  --color-easter-egg-600: #5d638f;
  --color-easter-egg-700: #494e76;
  --color-easter-egg-800: #383d5f;
  --color-easter-egg-900: #2b2f4c;
  --color-easter-egg-950: #1a1d32;
  --color-new-love: #beb9e2;
  --color-new-love-50: #f4f2ff;
  --color-new-love-100: #e9e6ff;
  --color-new-love-200: #d5d1f1;
  --color-new-love-300: #beb9e2;
  --color-new-love-400: #9f9ac1;
  --color-new-love-500: #847fa6;
  --color-new-love-600: #6a658a;
  --color-new-love-700: #545070;
  --color-new-love-800: #423e5a;
  --color-new-love-900: #332f47;
  --color-new-love-950: #1f1c2e;
}