Larb Gai to Castro color palette

E5C5AELarb Gai C58FA6Pinch Me 3B7D86Mysterious Blue 1F5A63Deep Sea Diver 461E29Castro

About this palette

Larb Gai to Castro is a 5-color warm, vintage palette: #E5C5AE (Larb Gai), #C58FA6 (Pinch Me), #3B7D86 (Mysterious Blue), #1F5A63 (Deep Sea Diver), #461E29 (Castro). It mixes orange, pink, turquoise, red tones and feels warm overall. The strongest text pairing is #E5C5AE on #461E29 with a contrast ratio of 8.75:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Larb Gai	rgb(229, 197, 174)	hsl(25, 51%, 79%)
Pinch Me	rgb(197, 143, 166)	hsl(334, 32%, 67%)
Mysterious Blue	rgb(59, 125, 134)	hsl(187, 39%, 38%)
Deep Sea Diver	rgb(31, 90, 99)	hsl(188, 52%, 25%)
Castro	rgb(70, 30, 41)	hsl(344, 40%, 20%)

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.75:1 Very good#E5C5AE on #461E29
Aa8.75:1 Very good#461E29 on #E5C5AE
Aa5.31:1 Good#C58FA6 on #461E29
Aa5.31:1 Good#461E29 on #C58FA6
Aa4.79:1 Good#E5C5AE on #1F5A63
Aa4.79:1 Good#1F5A63 on #E5C5AE
Aa3.02:1 Poor#3B7D86 on #461E29
Aa3.02:1 Poor#461E29 on #3B7D86

Color blindness preview

CSS variables

/* Larb Gai to Castro — https://swatchly.xyz/palette/e5c5ae-c58fa6-3b7d86-1f5a63-461e29 */
:root {
  --larb-gai: #e5c5ae;
  --pinch-me: #c58fa6;
  --mysterious-blue: #3b7d86;
  --deep-sea-diver: #1f5a63;
  --castro: #461e29;
}

Tailwind CSS v4

/* Larb Gai to Castro — https://swatchly.xyz/palette/e5c5ae-c58fa6-3b7d86-1f5a63-461e29 */
@theme {
  --color-larb-gai: #e5c5ae;
  --color-larb-gai-50: #fffaf6;
  --color-larb-gai-100: #fff0e5;
  --color-larb-gai-200: #f3dccc;
  --color-larb-gai-300: #e5c5ae;
  --color-larb-gai-400: #c1a48f;
  --color-larb-gai-500: #a48671;
  --color-larb-gai-600: #866a56;
  --color-larb-gai-700: #6c5240;
  --color-larb-gai-800: #553f2e;
  --color-larb-gai-900: #412e21;
  --color-larb-gai-950: #291c12;
  --color-pinch-me: #c58fa6;
  --color-pinch-me-50: #fff1f6;
  --color-pinch-me-100: #ffe2ed;
  --color-pinch-me-200: #f4cadb;
  --color-pinch-me-300: #e1b1c5;
  --color-pinch-me-400: #c58fa6;
  --color-pinch-me-500: #a8748b;
  --color-pinch-me-600: #8b5a70;
  --color-pinch-me-700: #724559;
  --color-pinch-me-800: #5b3446;
  --color-pinch-me-900: #472736;
  --color-pinch-me-950: #2e1721;
  --color-mysterious-blue: #3b7d86;
  --color-mysterious-blue-50: #e0fbff;
  --color-mysterious-blue-100: #cdf5fb;
  --color-mysterious-blue-200: #b4e4ea;
  --color-mysterious-blue-300: #99cfd7;
  --color-mysterious-blue-400: #74b2ba;
  --color-mysterious-blue-500: #5697a0;
  --color-mysterious-blue-600: #3b7d86;
  --color-mysterious-blue-700: #26646c;
  --color-mysterious-blue-800: #154f56;
  --color-mysterious-blue-900: #093d43;
  --color-mysterious-blue-950: #02262b;
  --color-deep-sea-diver: #1f5a63;
  --color-deep-sea-diver-50: #e1fbff;
  --color-deep-sea-diver-100: #cff3f9;
  --color-deep-sea-diver-200: #b5e0e7;
  --color-deep-sea-diver-300: #98c9d2;
  --color-deep-sea-diver-400: #72aab3;
  --color-deep-sea-diver-500: #548d97;
  --color-deep-sea-diver-600: #3a727b;
  --color-deep-sea-diver-700: #1f5a63;
  --color-deep-sea-diver-800: #18464d;
  --color-deep-sea-diver-900: #0f363c;
  --color-deep-sea-diver-950: #062226;
  --color-castro: #461e29;
  --color-castro-50: #fff1f4;
  --color-castro-100: #ffe3e8;
  --color-castro-200: #f4cbd4;
  --color-castro-300: #e0b3bd;
  --color-castro-400: #c2919c;
  --color-castro-500: #a5747f;
  --color-castro-600: #875a64;
  --color-castro-700: #6c434d;
  --color-castro-800: #54323a;
  --color-castro-900: #461e29;
  --color-castro-950: #271419;
}