Vintage to Gold Rush color palette

85789CVintage 4D4533Heavy Metal D9F0DDVanishing Point BDD0BCIsle of Dreams 66627APlummy C1AA7DGold Rush

Open in generator Export PNG, PDF, ASE…

About this palette

Vintage to Gold Rush is a 6-color muted palette: #85789C (Vintage), #4D4533 (Heavy Metal), #D9F0DD (Vanishing Point), #BDD0BC (Isle of Dreams), #66627A (Plummy), #C1AA7D (Gold Rush). It mixes purple, gray, green, yellow tones and feels cool overall. The strongest text pairing is #4D4533 on #D9F0DD with a contrast ratio of 7.88:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Vintage	rgb(133, 120, 156)	hsl(262, 15%, 54%)
Heavy Metal	rgb(77, 69, 51)	hsl(42, 20%, 25%)
Vanishing Point	rgb(217, 240, 221)	hsl(130, 43%, 90%)
Isle of Dreams	rgb(189, 208, 188)	hsl(117, 18%, 78%)
Plummy	rgb(102, 98, 122)	hsl(250, 11%, 43%)
Gold Rush	rgb(193, 170, 125)	hsl(40, 35%, 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.

Aa7.88:1 Very good#4D4533 on #D9F0DD
Aa7.88:1 Very good#D9F0DD on #4D4533
Aa5.83:1 Good#4D4533 on #BDD0BC
Aa5.83:1 Good#BDD0BC on #4D4533
Aa4.86:1 Good#D9F0DD on #66627A
Aa4.86:1 Good#66627A on #D9F0DD
Aa4.21:1 Poor#4D4533 on #C1AA7D
Aa4.21:1 Poor#C1AA7D on #4D4533

Color blindness preview

CSS variables

/* Vintage to Gold Rush — https://swatchly.xyz/palette/85789c-4d4533-d9f0dd-bdd0bc-66627a-c1aa7d */
:root {
  --vintage: #85789c;
  --heavy-metal: #4d4533;
  --vanishing-point: #d9f0dd;
  --isle-of-dreams: #bdd0bc;
  --plummy: #66627a;
  --gold-rush: #c1aa7d;
}

Tailwind CSS v4

/* Vintage to Gold Rush — https://swatchly.xyz/palette/85789c-4d4533-d9f0dd-bdd0bc-66627a-c1aa7d */
@theme {
  --color-vintage: #85789c;
  --color-vintage-50: #f6f1ff;
  --color-vintage-100: #ece4fd;
  --color-vintage-200: #d8ceec;
  --color-vintage-300: #c1b5d7;
  --color-vintage-400: #a194b9;
  --color-vintage-500: #85789c;
  --color-vintage-600: #6c5f81;
  --color-vintage-700: #564b69;
  --color-vintage-800: #443a54;
  --color-vintage-900: #342c42;
  --color-vintage-950: #211b2b;
  --color-heavy-metal: #4d4533;
  --color-heavy-metal-50: #faf5e9;
  --color-heavy-metal-100: #f1ebdd;
  --color-heavy-metal-200: #ded7c7;
  --color-heavy-metal-300: #c9c1af;
  --color-heavy-metal-400: #aba28f;
  --color-heavy-metal-500: #908774;
  --color-heavy-metal-600: #766d5b;
  --color-heavy-metal-700: #5f5846;
  --color-heavy-metal-800: #4d4533;
  --color-heavy-metal-900: #3b3528;
  --color-heavy-metal-950: #252117;
  --color-vanishing-point: #d9f0dd;
  --color-vanishing-point-50: #eaf7ec;
  --color-vanishing-point-100: #d9f0dd;
  --color-vanishing-point-200: #cadbcd;
  --color-vanishing-point-300: #b2c5b6;
  --color-vanishing-point-400: #92a796;
  --color-vanishing-point-500: #778c7b;
  --color-vanishing-point-600: #5e7161;
  --color-vanishing-point-700: #495b4c;
  --color-vanishing-point-800: #37473a;
  --color-vanishing-point-900: #29372c;
  --color-vanishing-point-950: #18221a;
  --color-isle-of-dreams: #bdd0bc;
  --color-isle-of-dreams-50: #f3fdf2;
  --color-isle-of-dreams-100: #eaf5e9;
  --color-isle-of-dreams-200: #d6e3d5;
  --color-isle-of-dreams-300: #bdd0bc;
  --color-isle-of-dreams-400: #9dae9c;
  --color-isle-of-dreams-500: #80917f;
  --color-isle-of-dreams-600: #647563;
  --color-isle-of-dreams-700: #4d5d4d;
  --color-isle-of-dreams-800: #3a483a;
  --color-isle-of-dreams-900: #2b362b;
  --color-isle-of-dreams-950: #1a2219;
  --color-plummy: #66627a;
  --color-plummy-50: #f5f3ff;
  --color-plummy-100: #eae7f9;
  --color-plummy-200: #d5d2e7;
  --color-plummy-300: #bebad1;
  --color-plummy-400: #9d99b3;
  --color-plummy-500: #817d96;
  --color-plummy-600: #66627a;
  --color-plummy-700: #514d62;
  --color-plummy-800: #3f3c4e;
  --color-plummy-900: #302e3d;
  --color-plummy-950: #1e1c27;
  --color-gold-rush: #c1aa7d;
  --color-gold-rush-50: #fff9ec;
  --color-gold-rush-100: #fef0d5;
  --color-gold-rush-200: #eedebe;
  --color-gold-rush-300: #dbc9a4;
  --color-gold-rush-400: #c1aa7d;
  --color-gold-rush-500: #a38c61;
  --color-gold-rush-600: #857045;
  --color-gold-rush-700: #6b5730;
  --color-gold-rush-800: #54431f;
  --color-gold-rush-900: #403214;
  --color-gold-rush-950: #281e08;
}