Veiled Rose to Royal Neptune Color Palette

About this palette

Veiled Rose to Royal Neptune is a 5-color cool, vintage palette: #F1CDC6 (Veiled Rose), #B3B994 (Green Tea), #8B6BB6 (Lavish Spending), #83574E (Root Beer), #003B45 (Royal Neptune). It mixes pink, green, purple, red, turquoise tones and feels cool overall. The strongest text pairing is #F1CDC6 on #003B45 with a contrast ratio of 8.35:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Veiled Rose	rgb(241, 205, 198)	hsl(10, 61%, 86%)
Green Tea	rgb(179, 185, 148)	hsl(70, 21%, 65%)
Lavish Spending	rgb(139, 107, 182)	hsl(266, 34%, 57%)
Root Beer	rgb(131, 87, 78)	hsl(10, 25%, 41%)
Royal Neptune	rgb(0, 59, 69)	hsl(189, 100%, 14%)

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.35:1 Very good#F1CDC6 on #003B45
Aa8.35:1 Very good#003B45 on #F1CDC6
Aa6.01:1 Good#B3B994 on #003B45
Aa6.01:1 Good#003B45 on #B3B994
Aa4.16:1 Poor#F1CDC6 on #83574E
Aa4.16:1 Poor#83574E on #F1CDC6

Color blindness preview

CSS variables

/* Veiled Rose to Royal Neptune — https://swatchly.xyz/palette/f1cdc6-b3b994-8b6bb6-83574e-003b45 */
:root {
  --veiled-rose: #f1cdc6;
  --green-tea: #b3b994;
  --lavish-spending: #8b6bb6;
  --root-beer: #83574e;
  --royal-neptune: #003b45;
}

Tailwind CSS v4

/* Veiled Rose to Royal Neptune — https://swatchly.xyz/palette/f1cdc6-b3b994-8b6bb6-83574e-003b45 */
@theme {
  --color-veiled-rose: #f1cdc6;
  --color-veiled-rose-50: #fff1ee;
  --color-veiled-rose-100: #fbe4e0;
  --color-veiled-rose-200: #f1cdc6;
  --color-veiled-rose-300: #d6b8b2;
  --color-veiled-rose-400: #b99892;
  --color-veiled-rose-500: #9d7d77;
  --color-veiled-rose-600: #82635d;
  --color-veiled-rose-700: #694d48;
  --color-veiled-rose-800: #543c37;
  --color-veiled-rose-900: #412d29;
  --color-veiled-rose-950: #2a1b18;
  --color-green-tea: #b3b994;
  --color-green-tea-50: #eef2db;
  --color-green-tea-100: #e1e6cc;
  --color-green-tea-200: #ccd1b3;
  --color-green-tea-300: #b3b994;
  --color-green-tea-400: #969c78;
  --color-green-tea-500: #7d825f;
  --color-green-tea-600: #656a49;
  --color-green-tea-700: #515537;
  --color-green-tea-800: #404329;
  --color-green-tea-900: #32351e;
  --color-green-tea-950: #1f2111;
  --color-lavish-spending: #8b6bb6;
  --color-lavish-spending-50: #f6f1ff;
  --color-lavish-spending-100: #ede2ff;
  --color-lavish-spending-200: #ddc6ff;
  --color-lavish-spending-300: #c7abf1;
  --color-lavish-spending-400: #a888d4;
  --color-lavish-spending-500: #8b6bb6;
  --color-lavish-spending-600: #725399;
  --color-lavish-spending-700: #5b3f7f;
  --color-lavish-spending-800: #493067;
  --color-lavish-spending-900: #392453;
  --color-lavish-spending-950: #241537;
  --color-root-beer: #83574e;
  --color-root-beer-50: #fff2ef;
  --color-root-beer-100: #ffe2dc;
  --color-root-beer-200: #f1cac2;
  --color-root-beer-300: #dcb1a7;
  --color-root-beer-400: #be8f85;
  --color-root-beer-500: #a07269;
  --color-root-beer-600: #83574e;
  --color-root-beer-700: #6a443c;
  --color-root-beer-800: #54342d;
  --color-root-beer-900: #432721;
  --color-root-beer-950: #2b1713;
  --color-royal-neptune: #003b45;
  --color-royal-neptune-50: #e4faff;
  --color-royal-neptune-100: #d2f2f9;
  --color-royal-neptune-200: #b9dfe8;
  --color-royal-neptune-300: #9ecad4;
  --color-royal-neptune-400: #7aabb6;
  --color-royal-neptune-500: #5d909b;
  --color-royal-neptune-600: #447580;
  --color-royal-neptune-700: #305e67;
  --color-royal-neptune-800: #214a52;
  --color-royal-neptune-900: #003b45;
  --color-royal-neptune-950: #0a2429;
}