Hokkaido Lavender to Paella Color Palette

About this palette

Hokkaido Lavender to Paella is a 4-color vibrant, neon palette: #7E35DF (Hokkaido Lavender), #C755B2 (Lustful Wishes), #00CC46 (Walled Garden), #DCC700 (Paella). It mixes purple, pink, green, yellow tones and feels balanced overall. The strongest text pairing is #7E35DF on #DCC700 with a contrast ratio of 3.53:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Hokkaido Lavender	rgb(126, 53, 223)	hsl(266, 73%, 54%)
Lustful Wishes	rgb(199, 85, 178)	hsl(311, 50%, 56%)
Walled Garden	rgb(0, 204, 70)	hsl(141, 100%, 40%)
Paella	rgb(220, 199, 0)	hsl(54, 100%, 43%)

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.

Aa3.53:1 Poor#7E35DF on #DCC700
Aa3.53:1 Poor#DCC700 on #7E35DF

Color blindness preview

CSS variables

/* Hokkaido Lavender to Paella — https://swatchly.xyz/palette/7e35df-c755b2-00cc46-dcc700 */
:root {
  --hokkaido-lavender: #7e35df;
  --lustful-wishes: #c755b2;
  --walled-garden: #00cc46;
  --paella: #dcc700;
}

Tailwind CSS v4

/* Hokkaido Lavender to Paella — https://swatchly.xyz/palette/7e35df-c755b2-00cc46-dcc700 */
@theme {
  --color-hokkaido-lavender: #7e35df;
  --color-hokkaido-lavender-50: #f6f3ff;
  --color-hokkaido-lavender-100: #ede7ff;
  --color-hokkaido-lavender-200: #dbcfff;
  --color-hokkaido-lavender-300: #c7b1ff;
  --color-hokkaido-lavender-400: #ad85ff;
  --color-hokkaido-lavender-500: #9856ff;
  --color-hokkaido-lavender-600: #7e35df;
  --color-hokkaido-lavender-700: #661ebb;
  --color-hokkaido-lavender-800: #52099b;
  --color-hokkaido-lavender-900: #40007d;
  --color-hokkaido-lavender-950: #280053;
  --color-lustful-wishes: #c755b2;
  --color-lustful-wishes-50: #fff0fb;
  --color-lustful-wishes-100: #ffe2f7;
  --color-lustful-wishes-200: #ffc2f0;
  --color-lustful-wishes-300: #ff9ae9;
  --color-lustful-wishes-400: #e374cd;
  --color-lustful-wishes-500: #c755b2;
  --color-lustful-wishes-600: #a83995;
  --color-lustful-wishes-700: #8a237a;
  --color-lustful-wishes-800: #701262;
  --color-lustful-wishes-900: #59074d;
  --color-lustful-wishes-950: #3a0132;
  --color-walled-garden: #00cc46;
  --color-walled-garden-50: #e9ffea;
  --color-walled-garden-100: #cdffcf;
  --color-walled-garden-200: #93f99d;
  --color-walled-garden-300: #6ce77c;
  --color-walled-garden-400: #00cc46;
  --color-walled-garden-500: #00aa39;
  --color-walled-garden-600: #00892c;
  --color-walled-garden-700: #006c21;
  --color-walled-garden-800: #005418;
  --color-walled-garden-900: #004010;
  --color-walled-garden-950: #002807;
  --color-paella: #dcc700;
  --color-paella-50: #fff9ca;
  --color-paella-100: #fcf19e;
  --color-paella-200: #ebde78;
  --color-paella-300: #dcc700;
  --color-paella-400: #b8a600;
  --color-paella-500: #998a00;
  --color-paella-600: #7b6f00;
  --color-paella-700: #615700;
  --color-paella-800: #4c4400;
  --color-paella-900: #3a3400;
  --color-paella-950: #242000;
}