Dragon Ball to Blush Hour Color Palette

About this palette

Dragon Ball to Blush Hour is a 4-color vibrant, warm palette: #FF9F2B (Dragon Ball), #C67800 (Maine Coon Orange), #8246DA (Hokkaido Lavender), #FF7198 (Blush Hour). It mixes orange, purple, pink tones and feels warm overall. The strongest text pairing is #FF9F2B on #8246DA with a contrast ratio of 2.67:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dragon Ball	rgb(255, 159, 43)	hsl(33, 100%, 58%)
Maine Coon Orange	rgb(198, 120, 0)	hsl(36, 100%, 39%)
Hokkaido Lavender	rgb(130, 70, 218)	hsl(264, 67%, 56%)
Blush Hour	rgb(255, 113, 152)	hsl(344, 100%, 72%)

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

/* Dragon Ball to Blush Hour — https://swatchly.xyz/palette/ff9f2b-c67800-8246da-ff7198 */
:root {
  --dragon-ball: #ff9f2b;
  --maine-coon-orange: #c67800;
  --hokkaido-lavender: #8246da;
  --blush-hour: #ff7198;
}

Tailwind CSS v4

/* Dragon Ball to Blush Hour — https://swatchly.xyz/palette/ff9f2b-c67800-8246da-ff7198 */
@theme {
  --color-dragon-ball: #ff9f2b;
  --color-dragon-ball-50: #ffeddd;
  --color-dragon-ball-100: #ffdfc1;
  --color-dragon-ball-200: #ffc389;
  --color-dragon-ball-300: #ff9f2b;
  --color-dragon-ball-400: #db8300;
  --color-dragon-ball-500: #b76d00;
  --color-dragon-ball-600: #955700;
  --color-dragon-ball-700: #784500;
  --color-dragon-ball-800: #5f3600;
  --color-dragon-ball-900: #4b2a00;
  --color-dragon-ball-950: #311900;
  --color-maine-coon-orange: #c67800;
  --color-maine-coon-orange-50: #fff4ea;
  --color-maine-coon-orange-100: #ffe9d5;
  --color-maine-coon-orange-200: #ffd2a5;
  --color-maine-coon-orange-300: #fab66e;
  --color-maine-coon-orange-400: #e0943e;
  --color-maine-coon-orange-500: #c67800;
  --color-maine-coon-orange-600: #a06000;
  --color-maine-coon-orange-700: #804b00;
  --color-maine-coon-orange-800: #643a00;
  --color-maine-coon-orange-900: #4d2c00;
  --color-maine-coon-orange-950: #311a00;
  --color-hokkaido-lavender: #8246da;
  --color-hokkaido-lavender-50: #f6f3ff;
  --color-hokkaido-lavender-100: #eee8ff;
  --color-hokkaido-lavender-200: #ddd1ff;
  --color-hokkaido-lavender-300: #cbb5ff;
  --color-hokkaido-lavender-400: #b18bff;
  --color-hokkaido-lavender-500: #9b63f8;
  --color-hokkaido-lavender-600: #8246da;
  --color-hokkaido-lavender-700: #692fb8;
  --color-hokkaido-lavender-800: #541c98;
  --color-hokkaido-lavender-900: #420f7b;
  --color-hokkaido-lavender-950: #2a0453;
  --color-blush-hour: #ff7198;
  --color-blush-hour-50: #fff4f6;
  --color-blush-hour-100: #ffe8ec;
  --color-blush-hour-200: #ffccd6;
  --color-blush-hour-300: #ffaabd;
  --color-blush-hour-400: #ff7198;
  --color-blush-hour-500: #dd537c;
  --color-blush-hour-600: #bc3561;
  --color-blush-hour-700: #9c1c4b;
  --color-blush-hour-800: #7f0839;
  --color-blush-hour-900: #64002a;
  --color-blush-hour-950: #410019;
}