Italian Roast to Fresh Air color palette

28100EItalian Roast 852300Caponata 00809BPacific Pleasure FF8072Smoked Salmon B1EAFFFresh Air

About this palette

Italian Roast to Fresh Air is a 5-color warm palette: #28100E (Italian Roast), #852300 (Caponata), #00809B (Pacific Pleasure), #FF8072 (Smoked Salmon), #B1EAFF (Fresh Air). It mixes brown, red, blue tones and feels warm overall. The strongest text pairing is #28100E on #B1EAFF with a contrast ratio of 13.74:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Italian Roast	rgb(40, 16, 14)	hsl(5, 48%, 11%)
Caponata	rgb(133, 35, 0)	hsl(16, 100%, 26%)
Pacific Pleasure	rgb(0, 128, 155)	hsl(190, 100%, 30%)
Smoked Salmon	rgb(255, 128, 114)	hsl(6, 100%, 72%)
Fresh Air	rgb(177, 234, 255)	hsl(196, 100%, 85%)

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.

Aa13.74:1 Super#28100E on #B1EAFF
Aa13.74:1 Super#B1EAFF on #28100E
Aa7.33:1 Very good#28100E on #FF8072
Aa7.33:1 Very good#FF8072 on #28100E
Aa7.19:1 Very good#852300 on #B1EAFF
Aa7.19:1 Very good#B1EAFF on #852300
Aa3.90:1 Poor#28100E on #00809B
Aa3.90:1 Poor#00809B on #28100E

Color blindness preview

CSS variables

/* Italian Roast to Fresh Air — https://swatchly.xyz/palette/28100e-852300-00809b-ff8072-b1eaff */
:root {
  --italian-roast: #28100e;
  --caponata: #852300;
  --pacific-pleasure: #00809b;
  --smoked-salmon: #ff8072;
  --fresh-air: #b1eaff;
}

Tailwind CSS v4

/* Italian Roast to Fresh Air — https://swatchly.xyz/palette/28100e-852300-00809b-ff8072-b1eaff */
@theme {
  --color-italian-roast: #28100e;
  --color-italian-roast-50: #fff2f0;
  --color-italian-roast-100: #fce5e2;
  --color-italian-roast-200: #ebd0cd;
  --color-italian-roast-300: #d7b9b5;
  --color-italian-roast-400: #b99995;
  --color-italian-roast-500: #9c7c78;
  --color-italian-roast-600: #7e605d;
  --color-italian-roast-700: #644946;
  --color-italian-roast-800: #4d3634;
  --color-italian-roast-900: #392725;
  --color-italian-roast-950: #28100e;
  --color-caponata: #852300;
  --color-caponata-50: #fff2ee;
  --color-caponata-100: #ffe5dd;
  --color-caponata-200: #ffc9ba;
  --color-caponata-300: #ffaa92;
  --color-caponata-400: #ea8568;
  --color-caponata-500: #d0694b;
  --color-caponata-600: #b34f32;
  --color-caponata-700: #983b1f;
  --color-caponata-800: #852300;
  --color-caponata-900: #661d06;
  --color-caponata-950: #450f01;
  --color-pacific-pleasure: #00809b;
  --color-pacific-pleasure-50: #e6f9ff;
  --color-pacific-pleasure-100: #d0f4ff;
  --color-pacific-pleasure-200: #a3e6fb;
  --color-pacific-pleasure-300: #84d2ea;
  --color-pacific-pleasure-400: #59b5d0;
  --color-pacific-pleasure-500: #339ab6;
  --color-pacific-pleasure-600: #00809b;
  --color-pacific-pleasure-700: #00667c;
  --color-pacific-pleasure-800: #004f61;
  --color-pacific-pleasure-900: #003d4b;
  --color-pacific-pleasure-950: #002630;
  --color-smoked-salmon: #ff8072;
  --color-smoked-salmon-50: #fff6f5;
  --color-smoked-salmon-100: #ffebe8;
  --color-smoked-salmon-200: #ffd2cc;
  --color-smoked-salmon-300: #ffb3a9;
  --color-smoked-salmon-400: #ff8072;
  --color-smoked-salmon-500: #dd6256;
  --color-smoked-salmon-600: #bc443b;
  --color-smoked-salmon-700: #9c2d26;
  --color-smoked-salmon-800: #7e1b17;
  --color-smoked-salmon-900: #630e0c;
  --color-smoked-salmon-950: #400404;
  --color-fresh-air: #b1eaff;
  --color-fresh-air-50: #f5fcff;
  --color-fresh-air-100: #e0f7ff;
  --color-fresh-air-200: #b1eaff;
  --color-fresh-air-300: #a2d0e1;
  --color-fresh-air-400: #7cb0c3;
  --color-fresh-air-500: #5d93a6;
  --color-fresh-air-600: #417789;
  --color-fresh-air-700: #2c5e6f;
  --color-fresh-air-800: #1c4957;
  --color-fresh-air-900: #123844;
  --color-fresh-air-950: #07232c;
}