Pan Purple to Asparagus Sultan color palette

637EFFPan Purple A72DDESweet Desire FF8572Smoked Salmon FA5E6BGrenadine Pink FF89B5Strawberry Dreams 729200Asparagus Sultan

Open in generator Export PNG, PDF, ASE…

About this palette

Pan Purple to Asparagus Sultan is a 6-color vibrant, neon palette: #637EFF (Pan Purple), #A72DDE (Sweet Desire), #FF8572 (Smoked Salmon), #FA5E6B (Grenadine Pink), #FF89B5 (Strawberry Dreams), #729200 (Asparagus Sultan). It mixes blue, purple, red, pink, green tones and feels balanced overall. The strongest text pairing is #A72DDE on #FF89B5 with a contrast ratio of 2.33:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pan Purple	rgb(99, 126, 255)	hsl(230, 100%, 69%)
Sweet Desire	rgb(167, 45, 222)	hsl(281, 73%, 52%)
Smoked Salmon	rgb(255, 133, 114)	hsl(8, 100%, 72%)
Grenadine Pink	rgb(250, 94, 107)	hsl(355, 94%, 67%)
Strawberry Dreams	rgb(255, 137, 181)	hsl(338, 100%, 77%)
Asparagus Sultan	rgb(114, 146, 0)	hsl(73, 100%, 29%)

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.

Color blindness preview

CSS variables

/* Pan Purple to Asparagus Sultan — https://swatchly.xyz/palette/637eff-a72dde-ff8572-fa5e6b-ff89b5-729200 */
:root {
  --pan-purple: #637eff;
  --sweet-desire: #a72dde;
  --smoked-salmon: #ff8572;
  --grenadine-pink: #fa5e6b;
  --strawberry-dreams: #ff89b5;
  --asparagus-sultan: #729200;
}

Tailwind CSS v4

/* Pan Purple to Asparagus Sultan — https://swatchly.xyz/palette/637eff-a72dde-ff8572-fa5e6b-ff89b5-729200 */
@theme {
  --color-pan-purple: #637eff;
  --color-pan-purple-50: #f3f6ff;
  --color-pan-purple-100: #e7edff;
  --color-pan-purple-200: #cdd9ff;
  --color-pan-purple-300: #b0c2ff;
  --color-pan-purple-400: #86a0ff;
  --color-pan-purple-500: #637eff;
  --color-pan-purple-600: #4b61dd;
  --color-pan-purple-700: #3848bc;
  --color-pan-purple-800: #29359b;
  --color-pan-purple-900: #1d267d;
  --color-pan-purple-950: #101554;
  --color-sweet-desire: #a72dde;
  --color-sweet-desire-50: #faf2ff;
  --color-sweet-desire-100: #f5e7ff;
  --color-sweet-desire-200: #eccfff;
  --color-sweet-desire-300: #e1b1ff;
  --color-sweet-desire-400: #d180ff;
  --color-sweet-desire-500: #c14ffa;
  --color-sweet-desire-600: #a72dde;
  --color-sweet-desire-700: #8a02bc;
  --color-sweet-desire-800: #6d0095;
  --color-sweet-desire-900: #540075;
  --color-sweet-desire-950: #36004d;
  --color-smoked-salmon: #ff8572;
  --color-smoked-salmon-50: #fff8f6;
  --color-smoked-salmon-100: #ffedea;
  --color-smoked-salmon-200: #ffd5cd;
  --color-smoked-salmon-300: #ffb7aa;
  --color-smoked-salmon-400: #ff8572;
  --color-smoked-salmon-500: #dc6756;
  --color-smoked-salmon-600: #bb4939;
  --color-smoked-salmon-700: #9b3124;
  --color-smoked-salmon-800: #7d1f14;
  --color-smoked-salmon-900: #62120a;
  --color-smoked-salmon-950: #3f0603;
  --color-grenadine-pink: #fa5e6b;
  --color-grenadine-pink-50: #ffeeee;
  --color-grenadine-pink-100: #ffdfde;
  --color-grenadine-pink-200: #ffc0c0;
  --color-grenadine-pink-300: #ff9b9d;
  --color-grenadine-pink-400: #fa5e6b;
  --color-grenadine-pink-500: #db4052;
  --color-grenadine-pink-600: #ba223b;
  --color-grenadine-pink-700: #9b0429;
  --color-grenadine-pink-800: #7d001f;
  --color-grenadine-pink-900: #630016;
  --color-grenadine-pink-950: #42000c;
  --color-strawberry-dreams: #ff89b5;
  --color-strawberry-dreams-50: #ffe8ef;
  --color-strawberry-dreams-100: #ffd6e3;
  --color-strawberry-dreams-200: #ffb4cd;
  --color-strawberry-dreams-300: #ff89b5;
  --color-strawberry-dreams-400: #dd6d98;
  --color-strawberry-dreams-500: #c2527f;
  --color-strawberry-dreams-600: #a43a67;
  --color-strawberry-dreams-700: #882852;
  --color-strawberry-dreams-800: #701a41;
  --color-strawberry-dreams-900: #5b1033;
  --color-strawberry-dreams-950: #3c061f;
  --color-asparagus-sultan: #729200;
  --color-asparagus-sultan-50: #e9ffc1;
  --color-asparagus-sultan-100: #ddf6af;
  --color-asparagus-sultan-200: #c7e38f;
  --color-asparagus-sultan-300: #aecd6b;
  --color-asparagus-sultan-400: #8dae3b;
  --color-asparagus-sultan-500: #729200;
  --color-asparagus-sultan-600: #5b7600;
  --color-asparagus-sultan-700: #485d00;
  --color-asparagus-sultan-800: #384900;
  --color-asparagus-sultan-900: #2a3800;
  --color-asparagus-sultan-950: #192300;
}