Delicate Seashell to Single Origin Color Palette

About this palette

Delicate Seashell to Single Origin is a 5-color warm, vintage, gradient palette: #FFEDDB (Delicate Seashell), #FFA38D (Frozen Salmon), #C1925A (Caramel Crumb), #815E00 (Grizzly), #743D3A (Single Origin). It mixes white, pink, orange, brown, red tones and feels warm overall. The strongest text pairing is #FFEDDB on #743D3A with a contrast ratio of 7.44:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Delicate Seashell	rgb(255, 237, 219)	hsl(30, 100%, 93%)
Frozen Salmon	rgb(255, 163, 141)	hsl(12, 100%, 78%)
Caramel Crumb	rgb(193, 146, 90)	hsl(33, 45%, 55%)
Grizzly	rgb(129, 94, 0)	hsl(44, 100%, 25%)
Single Origin	rgb(116, 61, 58)	hsl(3, 33%, 34%)

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.

Aa7.44:1 Very good#FFEDDB on #743D3A
Aa7.44:1 Very good#743D3A on #FFEDDB
Aa5.20:1 Good#FFEDDB on #815E00
Aa5.20:1 Good#815E00 on #FFEDDB
Aa4.40:1 Poor#FFA38D on #743D3A
Aa4.40:1 Poor#743D3A on #FFA38D
Aa3.08:1 Poor#FFA38D on #815E00
Aa3.08:1 Poor#815E00 on #FFA38D

Color blindness preview

CSS variables

/* Delicate Seashell to Single Origin — https://swatchly.xyz/palette/ffeddb-ffa38d-c1925a-815e00-743d3a */
:root {
  --delicate-seashell: #ffeddb;
  --frozen-salmon: #ffa38d;
  --caramel-crumb: #c1925a;
  --grizzly: #815e00;
  --single-origin: #743d3a;
}

Tailwind CSS v4

/* Delicate Seashell to Single Origin — https://swatchly.xyz/palette/ffeddb-ffa38d-c1925a-815e00-743d3a */
@theme {
  --color-delicate-seashell: #ffeddb;
  --color-delicate-seashell-50: #ffeddb;
  --color-delicate-seashell-100: #f1e5da;
  --color-delicate-seashell-200: #dfd2c5;
  --color-delicate-seashell-300: #cbbcad;
  --color-delicate-seashell-400: #ad9d8d;
  --color-delicate-seashell-500: #928272;
  --color-delicate-seashell-600: #786959;
  --color-delicate-seashell-700: #605345;
  --color-delicate-seashell-800: #4c4034;
  --color-delicate-seashell-900: #3b3126;
  --color-delicate-seashell-950: #251e16;
  --color-frozen-salmon: #ffa38d;
  --color-frozen-salmon-50: #fff0ec;
  --color-frozen-salmon-100: #ffe2db;
  --color-frozen-salmon-200: #ffc6b8;
  --color-frozen-salmon-300: #ffa38d;
  --color-frozen-salmon-400: #db8571;
  --color-frozen-salmon-500: #bf6955;
  --color-frozen-salmon-600: #a1503d;
  --color-frozen-salmon-700: #853b2a;
  --color-frozen-salmon-800: #6c2b1d;
  --color-frozen-salmon-900: #561f13;
  --color-frozen-salmon-950: #381108;
  --color-caramel-crumb: #c1925a;
  --color-caramel-crumb-50: #fff1e1;
  --color-caramel-crumb-100: #ffe3c4;
  --color-caramel-crumb-200: #f2cca2;
  --color-caramel-crumb-300: #deb483;
  --color-caramel-crumb-400: #c1925a;
  --color-caramel-crumb-500: #a57840;
  --color-caramel-crumb-600: #895e27;
  --color-caramel-crumb-700: #704a14;
  --color-caramel-crumb-800: #5a3806;
  --color-caramel-crumb-900: #482b01;
  --color-caramel-crumb-950: #2f1a00;
  --color-grizzly: #815e00;
  --color-grizzly-50: #fff4df;
  --color-grizzly-100: #ffe7b9;
  --color-grizzly-200: #eed199;
  --color-grizzly-300: #d9b878;
  --color-grizzly-400: #bb974e;
  --color-grizzly-500: #9e7a2c;
  --color-grizzly-600: #815e00;
  --color-grizzly-700: #674a00;
  --color-grizzly-800: #513a00;
  --color-grizzly-900: #3f2c00;
  --color-grizzly-950: #281b00;
  --color-single-origin: #743d3a;
  --color-single-origin-50: #fff2f0;
  --color-single-origin-100: #ffe4e1;
  --color-single-origin-200: #fbc8c4;
  --color-single-origin-300: #e7aeaa;
  --color-single-origin-400: #c98c87;
  --color-single-origin-500: #ac6f6b;
  --color-single-origin-600: #8d5551;
  --color-single-origin-700: #743d3a;
  --color-single-origin-800: #5a2f2d;
  --color-single-origin-900: #472321;
  --color-single-origin-950: #2e1413;
}