Start generating

Cloud Number Nine to Veil of Cinder color palette

F6CDBFCloud Number NineD1949BRosettiC98856Butter Bronze886643Barrel Aged76372CEbi Brown704D54Veil of Cinder
Open in generator Export PNG, PDF, ASE…

About this palette

Cloud Number Nine to Veil of Cinder is a 6-color warm, vintage palette: #F6CDBF (Cloud Number Nine), #D1949B (Rosetti), #C98856 (Butter Bronze), #886643 (Barrel Aged), #76372C (Ebi Brown), #704D54 (Veil of Cinder). It mixes pink, red, orange, brown tones and feels warm overall. The strongest text pairing is #F6CDBF on #76372C with a contrast ratio of 6.12:1, and 2 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Cloud Number Ninergb(246, 205, 191)hsl(15, 75%, 86%)
Rosettirgb(209, 148, 155)hsl(353, 40%, 70%)
Butter Bronzergb(201, 136, 86)hsl(26, 52%, 56%)
Barrel Agedrgb(136, 102, 67)hsl(30, 34%, 40%)
Ebi Brownrgb(118, 55, 44)hsl(9, 46%, 32%)
Veil of Cinderrgb(112, 77, 84)hsl(348, 19%, 37%)

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.12:1 Good#F6CDBF on #76372C
  • Aa6.12:1 Good#76372C on #F6CDBF
  • Aa5.00:1 Good#F6CDBF on #704D54
  • Aa5.00:1 Good#704D54 on #F6CDBF
  • Aa3.58:1 Poor#D1949B on #76372C
  • Aa3.58:1 Poor#76372C on #D1949B
  • Aa3.58:1 Poor#F6CDBF on #886643
  • Aa3.58:1 Poor#886643 on #F6CDBF

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Cloud Number Nine to Veil of Cinder — https://swatchly.xyz/palette/f6cdbf-d1949b-c98856-886643-76372c-704d54 */
:root {
  --cloud-number-nine: #f6cdbf;
  --rosetti: #d1949b;
  --butter-bronze: #c98856;
  --barrel-aged: #886643;
  --ebi-brown: #76372c;
  --veil-of-cinder: #704d54;
}

Tailwind CSS v4

/* Cloud Number Nine to Veil of Cinder — https://swatchly.xyz/palette/f6cdbf-d1949b-c98856-886643-76372c-704d54 */
@theme {
  --color-cloud-number-nine: #f6cdbf;
  --color-cloud-number-nine-50: #fff2ed;
  --color-cloud-number-nine-100: #ffe5dc;
  --color-cloud-number-nine-200: #f6cdbf;
  --color-cloud-number-nine-300: #dbb8ac;
  --color-cloud-number-nine-400: #bd988b;
  --color-cloud-number-nine-500: #a17c70;
  --color-cloud-number-nine-600: #856256;
  --color-cloud-number-nine-700: #6c4d42;
  --color-cloud-number-nine-800: #563b31;
  --color-cloud-number-nine-900: #442c24;
  --color-cloud-number-nine-950: #2b1b15;
  --color-rosetti: #d1949b;
  --color-rosetti-50: #fff4f5;
  --color-rosetti-100: #ffe7ea;
  --color-rosetti-200: #fcced2;
  --color-rosetti-300: #ebb6bb;
  --color-rosetti-400: #d1949b;
  --color-rosetti-500: #b2787f;
  --color-rosetti-600: #955d64;
  --color-rosetti-700: #79474e;
  --color-rosetti-800: #61353b;
  --color-rosetti-900: #4c272c;
  --color-rosetti-950: #30161a;
  --color-butter-bronze: #c98856;
  --color-butter-bronze-50: #ffefe3;
  --color-butter-bronze-100: #ffe0ca;
  --color-butter-bronze-200: #fac59e;
  --color-butter-bronze-300: #e7ab7f;
  --color-butter-bronze-400: #c98856;
  --color-butter-bronze-500: #ad6e3c;
  --color-butter-bronze-600: #915624;
  --color-butter-bronze-700: #774212;
  --color-butter-bronze-800: #613205;
  --color-butter-bronze-900: #4d2600;
  --color-butter-bronze-950: #331700;
  --color-barrel-aged: #886643;
  --color-barrel-aged-50: #fff3e7;
  --color-barrel-aged-100: #ffe7cf;
  --color-barrel-aged-200: #efd3b7;
  --color-barrel-aged-300: #dcbb9c;
  --color-barrel-aged-400: #be9b79;
  --color-barrel-aged-500: #a3805c;
  --color-barrel-aged-600: #886643;
  --color-barrel-aged-700: #6e5030;
  --color-barrel-aged-800: #583d21;
  --color-barrel-aged-900: #452e16;
  --color-barrel-aged-950: #2c1c0a;
  --color-ebi-brown: #76372c;
  --color-ebi-brown-50: #fff2ef;
  --color-ebi-brown-100: #ffe4df;
  --color-ebi-brown-200: #ffc6bb;
  --color-ebi-brown-300: #ecab9e;
  --color-ebi-brown-400: #cd887a;
  --color-ebi-brown-500: #af6b5e;
  --color-ebi-brown-600: #905044;
  --color-ebi-brown-700: #76372c;
  --color-ebi-brown-800: #5b2b23;
  --color-ebi-brown-900: #482019;
  --color-ebi-brown-950: #2e120d;
  --color-veil-of-cinder: #704d54;
  --color-veil-of-cinder-50: #fff1f3;
  --color-veil-of-cinder-100: #fee3e8;
  --color-veil-of-cinder-200: #eecfd4;
  --color-veil-of-cinder-300: #dbb8be;
  --color-veil-of-cinder-400: #be989f;
  --color-veil-of-cinder-500: #a37d84;
  --color-veil-of-cinder-600: #87636a;
  --color-veil-of-cinder-700: #704d54;
  --color-veil-of-cinder-800: #583c41;
  --color-veil-of-cinder-900: #452d32;
  --color-veil-of-cinder-950: #2c1b1e;
}

Similar palettes