Elite Teal to Red Elegance Color Palette

About this palette

Elite Teal to Red Elegance is a 4-color vintage palette: #053131 (Elite Teal), #F7B5BF (Love Spell), #67A09F (Atlas Cedar), #7E424D (Red Elegance). It mixes turquoise, pink, red tones and feels balanced overall. The strongest text pairing is #053131 on #F7B5BF with a contrast ratio of 8.27:1, and 2 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Elite Teal	rgb(5, 49, 49)	hsl(180, 81%, 11%)
Love Spell	rgb(247, 181, 191)	hsl(351, 80%, 84%)
Atlas Cedar	rgb(103, 160, 159)	hsl(179, 23%, 52%)
Red Elegance	rgb(126, 66, 77)	hsl(349, 31%, 38%)

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.27:1 Very good#053131 on #F7B5BF
Aa8.27:1 Very good#F7B5BF on #053131
Aa4.77:1 Good#053131 on #67A09F
Aa4.77:1 Good#67A09F on #053131
Aa4.44:1 Poor#F7B5BF on #7E424D
Aa4.44:1 Poor#7E424D on #F7B5BF

Color blindness preview

CSS variables

/* Elite Teal to Red Elegance — https://swatchly.xyz/palette/053131-f7b5bf-67a09f-7e424d */
:root {
  --elite-teal: #053131;
  --love-spell: #f7b5bf;
  --atlas-cedar: #67a09f;
  --red-elegance: #7e424d;
}

Tailwind CSS v4

/* Elite Teal to Red Elegance — https://swatchly.xyz/palette/053131-f7b5bf-67a09f-7e424d */
@theme {
  --color-elite-teal: #053131;
  --color-elite-teal-50: #e3fbfa;
  --color-elite-teal-100: #d7f1f1;
  --color-elite-teal-200: #bfdfde;
  --color-elite-teal-300: #a5c9c8;
  --color-elite-teal-400: #80a9a8;
  --color-elite-teal-500: #628c8b;
  --color-elite-teal-600: #486f6f;
  --color-elite-teal-700: #335656;
  --color-elite-teal-800: #234141;
  --color-elite-teal-900: #053131;
  --color-elite-teal-950: #0b1c1c;
  --color-love-spell: #f7b5bf;
  --color-love-spell-50: #fff7f8;
  --color-love-spell-100: #ffecee;
  --color-love-spell-200: #ffd1d8;
  --color-love-spell-300: #f7b5bf;
  --color-love-spell-400: #d2969f;
  --color-love-spell-500: #b57882;
  --color-love-spell-600: #965c66;
  --color-love-spell-700: #7a464f;
  --color-love-spell-800: #61343c;
  --color-love-spell-900: #4b262d;
  --color-love-spell-950: #31161b;
  --color-atlas-cedar: #67a09f;
  --color-atlas-cedar-50: #d7f8f7;
  --color-atlas-cedar-100: #c7edec;
  --color-atlas-cedar-200: #abd8d7;
  --color-atlas-cedar-300: #8dc1c0;
  --color-atlas-cedar-400: #67a09f;
  --color-atlas-cedar-500: #4e8786;
  --color-atlas-cedar-600: #386e6d;
  --color-atlas-cedar-700: #265958;
  --color-atlas-cedar-800: #1a4746;
  --color-atlas-cedar-900: #113838;
  --color-atlas-cedar-950: #072424;
  --color-red-elegance: #7e424d;
  --color-red-elegance-50: #fff1f3;
  --color-red-elegance-100: #ffe3e7;
  --color-red-elegance-200: #fdc8cf;
  --color-red-elegance-300: #ebafb8;
  --color-red-elegance-400: #cf8e98;
  --color-red-elegance-500: #b3727d;
  --color-red-elegance-600: #965963;
  --color-red-elegance-700: #7e424d;
  --color-red-elegance-800: #63333c;
  --color-red-elegance-900: #4e252d;
  --color-red-elegance-950: #33151b;
}