Start generating

Old Study to Frozen Landscape color palette

3F1912Old Study004252Cold and DarkBA441ASpice MarketD9764CHoly Cannoli00BEDECaribbean BlueB2E8FFFrozen Landscape
Open in generator Export PNG, PDF, ASE…

About this palette

Old Study to Frozen Landscape is a 6-color palette: #3F1912 (Old Study), #004252 (Cold and Dark), #BA441A (Spice Market), #D9764C (Holy Cannoli), #00BEDE (Caribbean Blue), #B2E8FF (Frozen Landscape). It mixes brown, blue, red, orange tones and feels balanced overall. The strongest text pairing is #3F1912 on #B2E8FF with a contrast ratio of 11.68:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Old Studyrgb(63, 25, 18)hsl(9, 56%, 16%)
Cold and Darkrgb(0, 66, 82)hsl(192, 100%, 16%)
Spice Marketrgb(186, 68, 26)hsl(16, 75%, 42%)
Holy Cannolirgb(217, 118, 76)hsl(18, 65%, 57%)
Caribbean Bluergb(0, 190, 222)hsl(189, 100%, 44%)
Frozen Landscapergb(178, 232, 255)hsl(198, 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.

  • Aa11.68:1 Very good#3F1912 on #B2E8FF
  • Aa11.68:1 Very good#B2E8FF on #3F1912
  • Aa8.35:1 Very good#004252 on #B2E8FF
  • Aa8.35:1 Very good#B2E8FF on #004252
  • Aa6.93:1 Good#3F1912 on #00BEDE
  • Aa6.93:1 Good#00BEDE on #3F1912
  • Aa4.96:1 Good#004252 on #00BEDE
  • Aa4.96:1 Good#00BEDE on #004252

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Old Study to Frozen Landscape — https://swatchly.xyz/palette/3f1912-004252-ba441a-d9764c-00bede-b2e8ff */
:root {
  --old-study: #3f1912;
  --cold-and-dark: #004252;
  --spice-market: #ba441a;
  --holy-cannoli: #d9764c;
  --caribbean-blue: #00bede;
  --frozen-landscape: #b2e8ff;
}

Tailwind CSS v4

/* Old Study to Frozen Landscape — https://swatchly.xyz/palette/3f1912-004252-ba441a-d9764c-00bede-b2e8ff */
@theme {
  --color-old-study: #3f1912;
  --color-old-study-50: #fff2ef;
  --color-old-study-100: #ffe4df;
  --color-old-study-200: #f4cdc5;
  --color-old-study-300: #e1b5ac;
  --color-old-study-400: #c4958b;
  --color-old-study-500: #a97a70;
  --color-old-study-600: #8e6258;
  --color-old-study-700: #764d45;
  --color-old-study-800: #613d35;
  --color-old-study-900: #4f2f29;
  --color-old-study-950: #3f1912;
  --color-cold-and-dark: #004252;
  --color-cold-and-dark-50: #e7f9ff;
  --color-cold-and-dark-100: #cff2fe;
  --color-cold-and-dark-200: #b6dfee;
  --color-cold-and-dark-300: #98c8d8;
  --color-cold-and-dark-400: #72a8ba;
  --color-cold-and-dark-500: #548b9d;
  --color-cold-and-dark-600: #396f7f;
  --color-cold-and-dark-700: #255665;
  --color-cold-and-dark-800: #004252;
  --color-cold-and-dark-900: #0e323c;
  --color-cold-and-dark-950: #051e26;
  --color-spice-market: #ba441a;
  --color-spice-market-50: #fff2ee;
  --color-spice-market-100: #ffe6de;
  --color-spice-market-200: #ffccbb;
  --color-spice-market-300: #ffab91;
  --color-spice-market-400: #f47e59;
  --color-spice-market-500: #d86039;
  --color-spice-market-600: #ba441a;
  --color-spice-market-700: #9a2e00;
  --color-spice-market-800: #7a2300;
  --color-spice-market-900: #5f1900;
  --color-spice-market-950: #3e0d00;
  --color-holy-cannoli: #d9764c;
  --color-holy-cannoli-50: #ffece5;
  --color-holy-cannoli-100: #ffdcce;
  --color-holy-cannoli-200: #ffbda3;
  --color-holy-cannoli-300: #f79b75;
  --color-holy-cannoli-400: #d9764c;
  --color-holy-cannoli-500: #bd5d32;
  --color-holy-cannoli-600: #9f451a;
  --color-holy-cannoli-700: #843206;
  --color-holy-cannoli-800: #6b2500;
  --color-holy-cannoli-900: #561c00;
  --color-holy-cannoli-950: #3a1000;
  --color-caribbean-blue: #00bede;
  --color-caribbean-blue-50: #edfbff;
  --color-caribbean-blue-100: #d6f6ff;
  --color-caribbean-blue-200: #9fecff;
  --color-caribbean-blue-300: #6cdaf4;
  --color-caribbean-blue-400: #00bede;
  --color-caribbean-blue-500: #009eb9;
  --color-caribbean-blue-600: #007f95;
  --color-caribbean-blue-700: #006476;
  --color-caribbean-blue-800: #004e5c;
  --color-caribbean-blue-900: #003b47;
  --color-caribbean-blue-950: #00242c;
  --color-frozen-landscape: #b2e8ff;
  --color-frozen-landscape-50: #f3fbff;
  --color-frozen-landscape-100: #dff5ff;
  --color-frozen-landscape-200: #b2e8ff;
  --color-frozen-landscape-300: #a3cee1;
  --color-frozen-landscape-400: #7daec3;
  --color-frozen-landscape-500: #5e92a7;
  --color-frozen-landscape-600: #43768a;
  --color-frozen-landscape-700: #2e5d6f;
  --color-frozen-landscape-800: #1f4858;
  --color-frozen-landscape-900: #143845;
  --color-frozen-landscape-950: #09232c;
}

Similar palettes