Cashew Nut to Bisque Color Palette

About this palette

Cashew Nut to Bisque is a 4-color pastel, light palette: #ECCFB5 (Cashew Nut), #BABFDE (Stardust Evening), #BBF8EA (Glacial Drift), #FFE7CB (Bisque). It mixes orange, purple, turquoise, white tones and feels balanced overall. The strongest text pairing is #BABFDE on #BBF8EA with a contrast ratio of 1.53:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Cashew Nut	rgb(236, 207, 181)	hsl(28, 59%, 82%)
Stardust Evening	rgb(186, 191, 222)	hsl(232, 35%, 80%)
Glacial Drift	rgb(187, 248, 234)	hsl(166, 81%, 85%)
Bisque	rgb(255, 231, 203)	hsl(32, 100%, 90%)

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.

Color blindness preview

CSS variables

/* Cashew Nut to Bisque — https://swatchly.xyz/palette/eccfb5-babfde-bbf8ea-ffe7cb */
:root {
  --cashew-nut: #eccfb5;
  --stardust-evening: #babfde;
  --glacial-drift: #bbf8ea;
  --bisque: #ffe7cb;
}

Tailwind CSS v4

/* Cashew Nut to Bisque — https://swatchly.xyz/palette/eccfb5-babfde-bbf8ea-ffe7cb */
@theme {
  --color-cashew-nut: #eccfb5;
  --color-cashew-nut-50: #fff1e4;
  --color-cashew-nut-100: #f8e5d5;
  --color-cashew-nut-200: #eccfb5;
  --color-cashew-nut-300: #d2baa4;
  --color-cashew-nut-400: #b59a82;
  --color-cashew-nut-500: #9a7f67;
  --color-cashew-nut-600: #7f664f;
  --color-cashew-nut-700: #66503b;
  --color-cashew-nut-800: #523e2c;
  --color-cashew-nut-900: #402f20;
  --color-cashew-nut-950: #281d11;
  --color-stardust-evening: #babfde;
  --color-stardust-evening-50: #f3f5ff;
  --color-stardust-evening-100: #e7eafe;
  --color-stardust-evening-200: #d2d6ee;
  --color-stardust-evening-300: #babfde;
  --color-stardust-evening-400: #9ba0bc;
  --color-stardust-evening-500: #8084a1;
  --color-stardust-evening-600: #666a85;
  --color-stardust-evening-700: #50536c;
  --color-stardust-evening-800: #3e4156;
  --color-stardust-evening-900: #2f3143;
  --color-stardust-evening-950: #1c1e2b;
  --color-glacial-drift: #bbf8ea;
  --color-glacial-drift-50: #dbfcf4;
  --color-glacial-drift-100: #bbf8ea;
  --color-glacial-drift-200: #b5e1d6;
  --color-glacial-drift-300: #99ccc0;
  --color-glacial-drift-400: #75aea1;
  --color-glacial-drift-500: #589386;
  --color-glacial-drift-600: #3f786c;
  --color-glacial-drift-700: #2b6056;
  --color-glacial-drift-800: #1c4c43;
  --color-glacial-drift-900: #113b33;
  --color-glacial-drift-950: #072520;
  --color-bisque: #ffe7cb;
  --color-bisque-50: #fff3e5;
  --color-bisque-100: #ffe7cb;
  --color-bisque-200: #e6d4c0;
  --color-bisque-300: #d1bda6;
  --color-bisque-400: #b39e84;
  --color-bisque-500: #988269;
  --color-bisque-600: #7c684f;
  --color-bisque-700: #64523b;
  --color-bisque-800: #4f3f2c;
  --color-bisque-900: #3e3020;
  --color-bisque-950: #271d11;
}