Peach Fizz to Bruised Plum color palette

FFA782Peach Fizz DA8473Island Coral A1679ECrown Jewels A8465BRose Laffy Taffy 653663Opulent Purple 3D1F26Bruised Plum

Open in generator Export PNG, PDF, ASE…

About this palette

Peach Fizz to Bruised Plum is a 6-color warm, gradient palette: #FFA782 (Peach Fizz), #DA8473 (Island Coral), #A1679E (Crown Jewels), #A8465B (Rose Laffy Taffy), #653663 (Opulent Purple), #3D1F26 (Bruised Plum). It mixes orange, red, pink, purple tones and feels warm overall. The strongest text pairing is #FFA782 on #3D1F26 with a contrast ratio of 7.80:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Peach Fizz	rgb(255, 167, 130)	hsl(18, 100%, 75%)
Island Coral	rgb(218, 132, 115)	hsl(10, 58%, 65%)
Crown Jewels	rgb(161, 103, 158)	hsl(303, 24%, 52%)
Rose Laffy Taffy	rgb(168, 70, 91)	hsl(347, 41%, 47%)
Opulent Purple	rgb(101, 54, 99)	hsl(303, 30%, 30%)
Bruised Plum	rgb(61, 31, 38)	hsl(346, 33%, 18%)

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.80:1 Very good#FFA782 on #3D1F26
Aa7.80:1 Very good#3D1F26 on #FFA782
Aa5.29:1 Good#DA8473 on #3D1F26
Aa5.29:1 Good#3D1F26 on #DA8473
Aa4.91:1 Good#FFA782 on #653663
Aa4.91:1 Good#653663 on #FFA782
Aa3.48:1 Poor#A1679E on #3D1F26
Aa3.48:1 Poor#3D1F26 on #A1679E

Color blindness preview

CSS variables

/* Peach Fizz to Bruised Plum — https://swatchly.xyz/palette/ffa782-da8473-a1679e-a8465b-653663-3d1f26 */
:root {
  --peach-fizz: #ffa782;
  --island-coral: #da8473;
  --crown-jewels: #a1679e;
  --rose-laffy-taffy: #a8465b;
  --opulent-purple: #653663;
  --bruised-plum: #3d1f26;
}

Tailwind CSS v4

/* Peach Fizz to Bruised Plum — https://swatchly.xyz/palette/ffa782-da8473-a1679e-a8465b-653663-3d1f26 */
@theme {
  --color-peach-fizz: #ffa782;
  --color-peach-fizz-50: #fff1ec;
  --color-peach-fizz-100: #ffe4d9;
  --color-peach-fizz-200: #ffc9b2;
  --color-peach-fizz-300: #ffa782;
  --color-peach-fizz-400: #db8966;
  --color-peach-fizz-500: #bf6d49;
  --color-peach-fizz-600: #a15330;
  --color-peach-fizz-700: #843e1d;
  --color-peach-fizz-800: #6b2d0f;
  --color-peach-fizz-900: #552106;
  --color-peach-fizz-950: #381202;
  --color-island-coral: #da8473;
  --color-island-coral-50: #fff0ed;
  --color-island-coral-100: #ffe2dc;
  --color-island-coral-200: #ffc6ba;
  --color-island-coral-300: #f5a898;
  --color-island-coral-400: #da8473;
  --color-island-coral-500: #bc6959;
  --color-island-coral-600: #9e5041;
  --color-island-coral-700: #833c2f;
  --color-island-coral-800: #6a2c21;
  --color-island-coral-900: #542016;
  --color-island-coral-950: #38110b;
  --color-crown-jewels: #a1679e;
  --color-crown-jewels-50: #ffedfd;
  --color-crown-jewels-100: #ffdbfc;
  --color-crown-jewels-200: #f2c1ee;
  --color-crown-jewels-300: #dda7d9;
  --color-crown-jewels-400: #be84bb;
  --color-crown-jewels-500: #a1679e;
  --color-crown-jewels-600: #854f83;
  --color-crown-jewels-700: #6d3c6b;
  --color-crown-jewels-800: #572c56;
  --color-crown-jewels-900: #452144;
  --color-crown-jewels-950: #2d132c;
  --color-rose-laffy-taffy: #a8465b;
  --color-rose-laffy-taffy-50: #fff1f3;
  --color-rose-laffy-taffy-100: #ffe3e6;
  --color-rose-laffy-taffy-200: #ffc6ce;
  --color-rose-laffy-taffy-300: #ffa2b1;
  --color-rose-laffy-taffy-400: #e37e90;
  --color-rose-laffy-taffy-500: #c66175;
  --color-rose-laffy-taffy-600: #a8465b;
  --color-rose-laffy-taffy-700: #8a3246;
  --color-rose-laffy-taffy-800: #702335;
  --color-rose-laffy-taffy-900: #591728;
  --color-rose-laffy-taffy-950: #3a0b17;
  --color-opulent-purple: #653663;
  --color-opulent-purple-50: #fff0fe;
  --color-opulent-purple-100: #ffe0fc;
  --color-opulent-purple-200: #f2c8ee;
  --color-opulent-purple-300: #dfb1dc;
  --color-opulent-purple-400: #c491c0;
  --color-opulent-purple-500: #aa76a7;
  --color-opulent-purple-600: #8f5d8c;
  --color-opulent-purple-700: #774975;
  --color-opulent-purple-800: #653663;
  --color-opulent-purple-900: #4d2a4c;
  --color-opulent-purple-950: #331932;
  --color-bruised-plum: #3d1f26;
  --color-bruised-plum-50: #fff1f3;
  --color-bruised-plum-100: #fee4e8;
  --color-bruised-plum-200: #edced4;
  --color-bruised-plum-300: #d9b7bd;
  --color-bruised-plum-400: #ba949b;
  --color-bruised-plum-500: #9c777e;
  --color-bruised-plum-600: #7e5c62;
  --color-bruised-plum-700: #63454b;
  --color-bruised-plum-800: #4b3237;
  --color-bruised-plum-900: #3d1f26;
  --color-bruised-plum-950: #211316;
}