Lucius Lilac to Deep Lagoon color palette

BDA9D4Lucius Lilac FFBEB9Peach Scone 2E3213Darkest Forest 8865A0Crown Jewels 00596FDeep Lagoon

About this palette

Lucius Lilac to Deep Lagoon is a 5-color cool palette: #BDA9D4 (Lucius Lilac), #FFBEB9 (Peach Scone), #2E3213 (Darkest Forest), #8865A0 (Crown Jewels), #00596F (Deep Lagoon). It mixes purple, pink, green, blue tones and feels cool overall. The strongest text pairing is #FFBEB9 on #2E3213 with a contrast ratio of 8.42:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Lucius Lilac	rgb(189, 169, 212)	hsl(268, 33%, 75%)
Peach Scone	rgb(255, 190, 185)	hsl(4, 100%, 86%)
Darkest Forest	rgb(46, 50, 19)	hsl(68, 45%, 14%)
Crown Jewels	rgb(136, 101, 160)	hsl(276, 24%, 51%)
Deep Lagoon	rgb(0, 89, 111)	hsl(192, 100%, 22%)

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.42:1 Very good#FFBEB9 on #2E3213
Aa8.42:1 Very good#2E3213 on #FFBEB9
Aa6.19:1 Good#BDA9D4 on #2E3213
Aa6.19:1 Good#2E3213 on #BDA9D4
Aa5.01:1 Good#FFBEB9 on #00596F
Aa5.01:1 Good#00596F on #FFBEB9
Aa3.68:1 Poor#BDA9D4 on #00596F
Aa3.68:1 Poor#00596F on #BDA9D4

Color blindness preview

CSS variables

/* Lucius Lilac to Deep Lagoon — https://swatchly.xyz/palette/bda9d4-ffbeb9-2e3213-8865a0-00596f */
:root {
  --lucius-lilac: #bda9d4;
  --peach-scone: #ffbeb9;
  --darkest-forest: #2e3213;
  --crown-jewels: #8865a0;
  --deep-lagoon: #00596f;
}

Tailwind CSS v4

/* Lucius Lilac to Deep Lagoon — https://swatchly.xyz/palette/bda9d4-ffbeb9-2e3213-8865a0-00596f */
@theme {
  --color-lucius-lilac: #bda9d4;
  --color-lucius-lilac-50: #f3e9ff;
  --color-lucius-lilac-100: #e9dbf9;
  --color-lucius-lilac-200: #d4c4e7;
  --color-lucius-lilac-300: #bda9d4;
  --color-lucius-lilac-400: #a08db6;
  --color-lucius-lilac-500: #87749c;
  --color-lucius-lilac-600: #6e5c82;
  --color-lucius-lilac-700: #59496b;
  --color-lucius-lilac-800: #473957;
  --color-lucius-lilac-900: #392c46;
  --color-lucius-lilac-950: #241b2d;
  --color-peach-scone: #ffbeb9;
  --color-peach-scone-50: #ffebea;
  --color-peach-scone-100: #ffdcd9;
  --color-peach-scone-200: #ffbeb9;
  --color-peach-scone-300: #e3aba7;
  --color-peach-scone-400: #c78c87;
  --color-peach-scone-500: #ac716d;
  --color-peach-scone-600: #905855;
  --color-peach-scone-700: #764441;
  --color-peach-scone-800: #603432;
  --color-peach-scone-900: #4c2725;
  --color-peach-scone-950: #311615;
  --color-darkest-forest: #2e3213;
  --color-darkest-forest-50: #f4f8e3;
  --color-darkest-forest-100: #eaeed7;
  --color-darkest-forest-200: #d6dbc0;
  --color-darkest-forest-300: #bfc5a6;
  --color-darkest-forest-400: #9fa583;
  --color-darkest-forest-500: #838967;
  --color-darkest-forest-600: #686d4d;
  --color-darkest-forest-700: #515639;
  --color-darkest-forest-800: #3e4229;
  --color-darkest-forest-900: #2e3213;
  --color-darkest-forest-950: #1c1e0f;
  --color-crown-jewels: #8865a0;
  --color-crown-jewels-50: #f9f2ff;
  --color-crown-jewels-100: #f5e7ff;
  --color-crown-jewels-200: #eacffe;
  --color-crown-jewels-300: #d7b8ee;
  --color-crown-jewels-400: #bb99d3;
  --color-crown-jewels-500: #a27eba;
  --color-crown-jewels-600: #8865a0;
  --color-crown-jewels-700: #6e4d84;
  --color-crown-jewels-800: #573a6a;
  --color-crown-jewels-900: #432b54;
  --color-crown-jewels-950: #2b1936;
  --color-deep-lagoon: #00596f;
  --color-deep-lagoon-50: #e7f9ff;
  --color-deep-lagoon-100: #cff2ff;
  --color-deep-lagoon-200: #ace0f3;
  --color-deep-lagoon-300: #8dc9df;
  --color-deep-lagoon-400: #65aac1;
  --color-deep-lagoon-500: #468da4;
  --color-deep-lagoon-600: #2a7187;
  --color-deep-lagoon-700: #00596f;
  --color-deep-lagoon-800: #054556;
  --color-deep-lagoon-900: #003644;
  --color-deep-lagoon-950: #00212b;
}