One Year of Rain to Old Rose Color Palette

About this palette

One Year of Rain to Old Rose is a 5-color muted, vintage palette: #2A465C (One Year of Rain), #FEEBE7 (Pink Swirl), #806C43 (Lizard), #9EBBDA (Sail Into the Horizon), #B98481 (Old Rose). It mixes blue, white, brown, red tones and feels balanced overall. The strongest text pairing is #2A465C on #FEEBE7 with a contrast ratio of 8.57:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
One Year of Rain	rgb(42, 70, 92)	hsl(206, 37%, 26%)
Pink Swirl	rgb(254, 235, 231)	hsl(10, 92%, 95%)
Lizard	rgb(128, 108, 67)	hsl(40, 31%, 38%)
Sail Into the Horizon	rgb(158, 187, 218)	hsl(211, 45%, 74%)
Old Rose	rgb(185, 132, 129)	hsl(3, 29%, 62%)

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.

Aa8.57:1 Very good#2A465C on #FEEBE7
Aa8.57:1 Very good#FEEBE7 on #2A465C
Aa4.97:1 Good#2A465C on #9EBBDA
Aa4.97:1 Good#9EBBDA on #2A465C
Aa4.40:1 Poor#FEEBE7 on #806C43
Aa4.40:1 Poor#806C43 on #FEEBE7
Aa3.14:1 Poor#2A465C on #B98481
Aa3.14:1 Poor#B98481 on #2A465C

Color blindness preview

CSS variables

/* One Year of Rain to Old Rose — https://swatchly.xyz/palette/2a465c-feebe7-806c43-9ebbda-b98481 */
:root {
  --one-year-of-rain: #2a465c;
  --pink-swirl: #feebe7;
  --lizard: #806c43;
  --sail-into-the-horizon: #9ebbda;
  --old-rose: #b98481;
}

Tailwind CSS v4

/* One Year of Rain to Old Rose — https://swatchly.xyz/palette/2a465c-feebe7-806c43-9ebbda-b98481 */
@theme {
  --color-one-year-of-rain: #2a465c;
  --color-one-year-of-rain-50: #edf7ff;
  --color-one-year-of-rain-100: #daeeff;
  --color-one-year-of-rain-200: #c3dbef;
  --color-one-year-of-rain-300: #aac5db;
  --color-one-year-of-rain-400: #88a6be;
  --color-one-year-of-rain-500: #6c8aa3;
  --color-one-year-of-rain-600: #537087;
  --color-one-year-of-rain-700: #3f596e;
  --color-one-year-of-rain-800: #2a465c;
  --color-one-year-of-rain-900: #223645;
  --color-one-year-of-rain-950: #13212c;
  --color-pink-swirl: #feebe7;
  --color-pink-swirl-50: #fff7f5;
  --color-pink-swirl-100: #feebe7;
  --color-pink-swirl-200: #e5d8d5;
  --color-pink-swirl-300: #cfc0bd;
  --color-pink-swirl-400: #b09f9c;
  --color-pink-swirl-500: #948380;
  --color-pink-swirl-600: #786865;
  --color-pink-swirl-700: #60514e;
  --color-pink-swirl-800: #4c3f3c;
  --color-pink-swirl-900: #3b302e;
  --color-pink-swirl-950: #251d1c;
  --color-lizard: #806c43;
  --color-lizard-50: #fff4de;
  --color-lizard-100: #f8eacf;
  --color-lizard-200: #e7d7b7;
  --color-lizard-300: #d3c09c;
  --color-lizard-400: #b5a179;
  --color-lizard-500: #9b865c;
  --color-lizard-600: #806c43;
  --color-lizard-700: #675530;
  --color-lizard-800: #524221;
  --color-lizard-900: #3f3216;
  --color-lizard-950: #281f0a;
  --color-sail-into-the-horizon: #9ebbda;
  --color-sail-into-the-horizon-50: #e6f2ff;
  --color-sail-into-the-horizon-100: #d3e7fd;
  --color-sail-into-the-horizon-200: #bbd2eb;
  --color-sail-into-the-horizon-300: #9ebbda;
  --color-sail-into-the-horizon-400: #829dba;
  --color-sail-into-the-horizon-500: #6883a0;
  --color-sail-into-the-horizon-600: #506a86;
  --color-sail-into-the-horizon-700: #3d556d;
  --color-sail-into-the-horizon-800: #2e4359;
  --color-sail-into-the-horizon-900: #233447;
  --color-sail-into-the-horizon-950: #14202e;
  --color-old-rose: #b98481;
  --color-old-rose-50: #fff5f4;
  --color-old-rose-100: #ffebe9;
  --color-old-rose-200: #fcd4d1;
  --color-old-rose-300: #ecbebb;
  --color-old-rose-400: #d19e9b;
  --color-old-rose-500: #b98481;
  --color-old-rose-600: #9a6765;
  --color-old-rose-700: #7d4f4d;
  --color-old-rose-800: #643c3a;
  --color-old-rose-900: #4e2c2a;
  --color-old-rose-950: #311918;
}