Black Stallion to Cashew Nut color palette

0E1A15Black Stallion 173F2BQueen of Trees 615683Berry Jam 757CBBOrbital DE9573Summer’s End F0CCBACashew Nut

Open in generator Export PNG, PDF, ASE…

About this palette

Black Stallion to Cashew Nut is a 6-color palette: #0E1A15 (Black Stallion), #173F2B (Queen of Trees), #615683 (Berry Jam), #757CBB (Orbital), #DE9573 (Summer’s End), #F0CCBA (Cashew Nut). It mixes black, green, purple, orange tones and feels cool overall. The strongest text pairing is #0E1A15 on #F0CCBA with a contrast ratio of 11.94:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Black Stallion	rgb(14, 26, 21)	hsl(155, 30%, 8%)
Queen of Trees	rgb(23, 63, 43)	hsl(150, 47%, 17%)
Berry Jam	rgb(97, 86, 131)	hsl(255, 21%, 43%)
Orbital	rgb(117, 124, 187)	hsl(234, 34%, 60%)
Summer’s End	rgb(222, 149, 115)	hsl(19, 62%, 66%)
Cashew Nut	rgb(240, 204, 186)	hsl(20, 64%, 84%)

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.

Aa11.94:1 Very good#0E1A15 on #F0CCBA
Aa11.94:1 Very good#F0CCBA on #0E1A15
Aa7.88:1 Very good#173F2B on #F0CCBA
Aa7.88:1 Very good#F0CCBA on #173F2B
Aa7.35:1 Very good#0E1A15 on #DE9573
Aa7.35:1 Very good#DE9573 on #0E1A15
Aa4.85:1 Good#173F2B on #DE9573
Aa4.85:1 Good#DE9573 on #173F2B

Color blindness preview

CSS variables

/* Black Stallion to Cashew Nut — https://swatchly.xyz/palette/0e1a15-173f2b-615683-757cbb-de9573-f0ccba */
:root {
  --black-stallion: #0e1a15;
  --queen-of-trees: #173f2b;
  --berry-jam: #615683;
  --orbital: #757cbb;
  --summer-s-end: #de9573;
  --cashew-nut: #f0ccba;
}

Tailwind CSS v4

/* Black Stallion to Cashew Nut — https://swatchly.xyz/palette/0e1a15-173f2b-615683-757cbb-de9573-f0ccba */
@theme {
  --color-black-stallion: #0e1a15;
  --color-black-stallion-50: #eff8f3;
  --color-black-stallion-100: #e4eee9;
  --color-black-stallion-200: #cfdbd5;
  --color-black-stallion-300: #b7c5be;
  --color-black-stallion-400: #97a69f;
  --color-black-stallion-500: #7a8882;
  --color-black-stallion-600: #5e6c66;
  --color-black-stallion-700: #47544e;
  --color-black-stallion-800: #343f3a;
  --color-black-stallion-900: #252e2a;
  --color-black-stallion-950: #0e1a15;
  --color-queen-of-trees: #173f2b;
  --color-queen-of-trees-50: #e4fcee;
  --color-queen-of-trees-100: #d8f3e3;
  --color-queen-of-trees-200: #c1e1cd;
  --color-queen-of-trees-300: #a7cbb6;
  --color-queen-of-trees-400: #85ad96;
  --color-queen-of-trees-500: #69927b;
  --color-queen-of-trees-600: #507862;
  --color-queen-of-trees-700: #3c614d;
  --color-queen-of-trees-800: #2d4d3b;
  --color-queen-of-trees-900: #173f2b;
  --color-queen-of-trees-950: #12271c;
  --color-berry-jam: #615683;
  --color-berry-jam-50: #f5f3ff;
  --color-berry-jam-100: #ece7ff;
  --color-berry-jam-200: #dbd3f9;
  --color-berry-jam-300: #c6bde8;
  --color-berry-jam-400: #a99fce;
  --color-berry-jam-500: #8f84b4;
  --color-berry-jam-600: #766b9a;
  --color-berry-jam-700: #615683;
  --color-berry-jam-800: #4c4368;
  --color-berry-jam-900: #3a3252;
  --color-berry-jam-950: #251f36;
  --color-orbital: #757cbb;
  --color-orbital-50: #f2f4ff;
  --color-orbital-100: #e4e8ff;
  --color-orbital-200: #cbd2ff;
  --color-orbital-300: #b1b9f4;
  --color-orbital-400: #9198d7;
  --color-orbital-500: #757cbb;
  --color-orbital-600: #5c629e;
  --color-orbital-700: #484d82;
  --color-orbital-800: #373b6a;
  --color-orbital-900: #2a2d55;
  --color-orbital-950: #191b38;
  --color-summer-s-end: #de9573;
  --color-summer-s-end-50: #fff6f2;
  --color-summer-s-end-100: #ffeae1;
  --color-summer-s-end-200: #ffd2bd;
  --color-summer-s-end-300: #f6b79b;
  --color-summer-s-end-400: #de9573;
  --color-summer-s-end-500: #be7857;
  --color-summer-s-end-600: #a05d3c;
  --color-summer-s-end-700: #834628;
  --color-summer-s-end-800: #693419;
  --color-summer-s-end-900: #52250e;
  --color-summer-s-end-950: #351505;
  --color-cashew-nut: #f0ccba;
  --color-cashew-nut-50: #fff0e8;
  --color-cashew-nut-100: #fbe3d8;
  --color-cashew-nut-200: #f0ccba;
  --color-cashew-nut-300: #d6b7a8;
  --color-cashew-nut-400: #b89887;
  --color-cashew-nut-500: #9d7d6c;
  --color-cashew-nut-600: #826353;
  --color-cashew-nut-700: #6a4e40;
  --color-cashew-nut-800: #543c30;
  --color-cashew-nut-900: #422d23;
  --color-cashew-nut-950: #2a1b14;
}