Peach Velour to Lost in the Woods color palette

FFB48FPeach Velour B0A6FFWidowmaker 785FDCCandy Grape Fizz 25613CMidori 003F25Lost in the Woods

About this palette

Peach Velour to Lost in the Woods is a 5-color cool, earthy palette: #FFB48F (Peach Velour), #B0A6FF (Widowmaker), #785FDC (Candy Grape Fizz), #25613C (Midori), #003F25 (Lost in the Woods). It mixes orange, purple, green tones and feels cool overall. The strongest text pairing is #FFB48F on #003F25 with a contrast ratio of 7.01:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Peach Velour	rgb(255, 180, 143)	hsl(20, 100%, 78%)
Widowmaker	rgb(176, 166, 255)	hsl(247, 100%, 83%)
Candy Grape Fizz	rgb(120, 95, 220)	hsl(252, 64%, 62%)
Midori	rgb(37, 97, 60)	hsl(143, 45%, 26%)
Lost in the Woods	rgb(0, 63, 37)	hsl(155, 100%, 12%)

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.01:1 Very good#FFB48F on #003F25
Aa7.01:1 Very good#003F25 on #FFB48F
Aa5.61:1 Good#B0A6FF on #003F25
Aa5.61:1 Good#003F25 on #B0A6FF
Aa4.27:1 Poor#FFB48F on #25613C
Aa4.27:1 Poor#25613C on #FFB48F
Aa3.41:1 Poor#B0A6FF on #25613C
Aa3.41:1 Poor#25613C on #B0A6FF

Color blindness preview

CSS variables

/* Peach Velour to Lost in the Woods — https://swatchly.xyz/palette/ffb48f-b0a6ff-785fdc-25613c-003f25 */
:root {
  --peach-velour: #ffb48f;
  --widowmaker: #b0a6ff;
  --candy-grape-fizz: #785fdc;
  --midori: #25613c;
  --lost-in-the-woods: #003f25;
}

Tailwind CSS v4

/* Peach Velour to Lost in the Woods — https://swatchly.xyz/palette/ffb48f-b0a6ff-785fdc-25613c-003f25 */
@theme {
  --color-peach-velour: #ffb48f;
  --color-peach-velour-50: #fff7f3;
  --color-peach-velour-100: #ffece2;
  --color-peach-velour-200: #ffd3bd;
  --color-peach-velour-300: #ffb48f;
  --color-peach-velour-400: #d99573;
  --color-peach-velour-500: #bc7754;
  --color-peach-velour-600: #9e5b39;
  --color-peach-velour-700: #814525;
  --color-peach-velour-800: #673316;
  --color-peach-velour-900: #51250c;
  --color-peach-velour-950: #351504;
  --color-widowmaker: #b0a6ff;
  --color-widowmaker-50: #edecff;
  --color-widowmaker-100: #e0deff;
  --color-widowmaker-200: #c9c4ff;
  --color-widowmaker-300: #b0a6ff;
  --color-widowmaker-400: #9489de;
  --color-widowmaker-500: #7b70c4;
  --color-widowmaker-600: #6458a7;
  --color-widowmaker-700: #50448c;
  --color-widowmaker-800: #3f3474;
  --color-widowmaker-900: #32285f;
  --color-widowmaker-950: #1f173f;
  --color-candy-grape-fizz: #785fdc;
  --color-candy-grape-fizz-50: #f4f4ff;
  --color-candy-grape-fizz-100: #ecebff;
  --color-candy-grape-fizz-200: #dad7ff;
  --color-candy-grape-fizz-300: #c5bfff;
  --color-candy-grape-fizz-400: #a89aff;
  --color-candy-grape-fizz-500: #9079f7;
  --color-candy-grape-fizz-600: #785fdc;
  --color-candy-grape-fizz-700: #6046ba;
  --color-candy-grape-fizz-800: #4b319a;
  --color-candy-grape-fizz-900: #3a227c;
  --color-candy-grape-fizz-950: #241253;
  --color-midori: #25613c;
  --color-midori-50: #deffe7;
  --color-midori-100: #d1f6db;
  --color-midori-200: #b7e4c4;
  --color-midori-300: #9bcfaa;
  --color-midori-400: #76b088;
  --color-midori-500: #59946c;
  --color-midori-600: #3f7853;
  --color-midori-700: #25613c;
  --color-midori-800: #1c4c2e;
  --color-midori-900: #123b22;
  --color-midori-950: #082513;
  --color-lost-in-the-woods: #003f25;
  --color-lost-in-the-woods-50: #dffeeb;
  --color-lost-in-the-woods-100: #d2f5e0;
  --color-lost-in-the-woods-200: #b9e3ca;
  --color-lost-in-the-woods-300: #9eceb2;
  --color-lost-in-the-woods-400: #7bb091;
  --color-lost-in-the-woods-500: #5e9576;
  --color-lost-in-the-woods-600: #447a5c;
  --color-lost-in-the-woods-700: #306247;
  --color-lost-in-the-woods-800: #214d36;
  --color-lost-in-the-woods-900: #003f25;
  --color-lost-in-the-woods-950: #0a2618;
}