Lama to Rich Black Color Palette

About this palette

Lama to Rich Black is a 5-color cool, vintage palette: #DDBE9D (Lama), #D4883F (Caramelise), #45887C (Highlands), #5D4669 (Haunted Candelabra), #003F40 (Rich Black). It mixes orange, turquoise, purple tones and feels cool overall. The strongest text pairing is #DDBE9D on #003F40 with a contrast ratio of 6.68:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Lama	rgb(221, 190, 157)	hsl(31, 48%, 74%)
Caramelise	rgb(212, 136, 63)	hsl(29, 63%, 54%)
Highlands	rgb(69, 136, 124)	hsl(169, 33%, 40%)
Haunted Candelabra	rgb(93, 70, 105)	hsl(279, 20%, 34%)
Rich Black	rgb(0, 63, 64)	hsl(181, 100%, 13%)

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.

Aa6.68:1 Good#DDBE9D on #003F40
Aa6.68:1 Good#003F40 on #DDBE9D
Aa4.69:1 Good#DDBE9D on #5D4669
Aa4.69:1 Good#5D4669 on #DDBE9D
Aa4.14:1 Poor#D4883F on #003F40
Aa4.14:1 Poor#003F40 on #D4883F

Color blindness preview

CSS variables

/* Lama to Rich Black — https://swatchly.xyz/palette/ddbe9d-d4883f-45887c-5d4669-003f40 */
:root {
  --lama: #ddbe9d;
  --caramelise: #d4883f;
  --highlands: #45887c;
  --haunted-candelabra: #5d4669;
  --rich-black: #003f40;
}

Tailwind CSS v4

/* Lama to Rich Black — https://swatchly.xyz/palette/ddbe9d-d4883f-45887c-5d4669-003f40 */
@theme {
  --color-lama: #ddbe9d;
  --color-lama-50: #fff5ea;
  --color-lama-100: #fdead5;
  --color-lama-200: #edd6be;
  --color-lama-300: #ddbe9d;
  --color-lama-400: #bb9e80;
  --color-lama-500: #9f8263;
  --color-lama-600: #836749;
  --color-lama-700: #6a5135;
  --color-lama-800: #543e26;
  --color-lama-900: #412f1a;
  --color-lama-950: #291c0e;
  --color-caramelise: #d4883f;
  --color-caramelise-50: #fff0e4;
  --color-caramelise-100: #ffe2cb;
  --color-caramelise-200: #ffc797;
  --color-caramelise-300: #f0ab6f;
  --color-caramelise-400: #d4883f;
  --color-caramelise-500: #b76d1f;
  --color-caramelise-600: #985500;
  --color-caramelise-700: #7a4300;
  --color-caramelise-800: #613400;
  --color-caramelise-900: #4c2800;
  --color-caramelise-950: #321800;
  --color-highlands: #45887c;
  --color-highlands-50: #d7fcf4;
  --color-highlands-100: #c6f1e8;
  --color-highlands-200: #aaddd2;
  --color-highlands-300: #8bc6ba;
  --color-highlands-400: #64a599;
  --color-highlands-500: #45887c;
  --color-highlands-600: #2e6f64;
  --color-highlands-700: #1c594f;
  --color-highlands-800: #10473e;
  --color-highlands-900: #073831;
  --color-highlands-950: #02241f;
  --color-haunted-candelabra: #5d4669;
  --color-haunted-candelabra-50: #faf1ff;
  --color-haunted-candelabra-100: #f5e4fe;
  --color-haunted-candelabra-200: #e2ceed;
  --color-haunted-candelabra-300: #ccb5d8;
  --color-haunted-candelabra-400: #ad94ba;
  --color-haunted-candelabra-500: #90789e;
  --color-haunted-candelabra-600: #745d81;
  --color-haunted-candelabra-700: #5d4669;
  --color-haunted-candelabra-800: #483652;
  --color-haunted-candelabra-900: #382940;
  --color-haunted-candelabra-950: #231829;
  --color-rich-black: #003f40;
  --color-rich-black-50: #defcfc;
  --color-rich-black-100: #d1f3f3;
  --color-rich-black-200: #b8e1e1;
  --color-rich-black-300: #9dcbcb;
  --color-rich-black-400: #7aadae;
  --color-rich-black-500: #5d9293;
  --color-rich-black-600: #447879;
  --color-rich-black-700: #306162;
  --color-rich-black-800: #214d4e;
  --color-rich-black-900: #003f40;
  --color-rich-black-950: #0a2727;
}