Start generating

Dawn Patrol to Wasabi Nori color palette

FFDFDFDawn Patrol00D1DFSea SerpentAD69FFOrion Nebula6B59ACProphet Violet005F65Beau Vert353100Wasabi Nori
Open in generator Export PNG, PDF, ASE…

About this palette

Dawn Patrol to Wasabi Nori is a 6-color cool palette: #FFDFDF (Dawn Patrol), #00D1DF (Sea Serpent), #AD69FF (Orion Nebula), #6B59AC (Prophet Violet), #005F65 (Beau Vert), #353100 (Wasabi Nori). It mixes pink, turquoise, purple, brown tones and feels cool overall. The strongest text pairing is #FFDFDF on #353100 with a contrast ratio of 10.61:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Dawn Patrolrgb(255, 223, 223)hsl(0, 100%, 94%)
Sea Serpentrgb(0, 209, 223)hsl(184, 100%, 44%)
Orion Nebulargb(173, 105, 255)hsl(267, 100%, 71%)
Prophet Violetrgb(107, 89, 172)hsl(253, 33%, 51%)
Beau Vertrgb(0, 95, 101)hsl(184, 100%, 20%)
Wasabi Norirgb(53, 49, 0)hsl(55, 100%, 10%)

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.

  • Aa10.61:1 Very good#FFDFDF on #353100
  • Aa10.61:1 Very good#353100 on #FFDFDF
  • Aa7.03:1 Very good#00D1DF on #353100
  • Aa7.03:1 Very good#353100 on #00D1DF
  • Aa5.97:1 Good#FFDFDF on #005F65
  • Aa5.97:1 Good#005F65 on #FFDFDF
  • Aa4.62:1 Good#FFDFDF on #6B59AC
  • Aa4.62:1 Good#6B59AC on #FFDFDF

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Dawn Patrol to Wasabi Nori — https://swatchly.xyz/palette/ffdfdf-00d1df-ad69ff-6b59ac-005f65-353100 */
:root {
  --dawn-patrol: #ffdfdf;
  --sea-serpent: #00d1df;
  --orion-nebula: #ad69ff;
  --prophet-violet: #6b59ac;
  --beau-vert: #005f65;
  --wasabi-nori: #353100;
}

Tailwind CSS v4

/* Dawn Patrol to Wasabi Nori — https://swatchly.xyz/palette/ffdfdf-00d1df-ad69ff-6b59ac-005f65-353100 */
@theme {
  --color-dawn-patrol: #ffdfdf;
  --color-dawn-patrol-50: #ffeeee;
  --color-dawn-patrol-100: #ffdfdf;
  --color-dawn-patrol-200: #e6cece;
  --color-dawn-patrol-300: #d2b7b7;
  --color-dawn-patrol-400: #b49898;
  --color-dawn-patrol-500: #9a7d7d;
  --color-dawn-patrol-600: #7e6464;
  --color-dawn-patrol-700: #664e4e;
  --color-dawn-patrol-800: #513c3c;
  --color-dawn-patrol-900: #3f2e2e;
  --color-dawn-patrol-950: #281b1c;
  --color-sea-serpent: #00d1df;
  --color-sea-serpent-50: #cdfbff;
  --color-sea-serpent-100: #9ff7ff;
  --color-sea-serpent-200: #74e5ef;
  --color-sea-serpent-300: #00d1df;
  --color-sea-serpent-400: #00b0bb;
  --color-sea-serpent-500: #00939d;
  --color-sea-serpent-600: #00777f;
  --color-sea-serpent-700: #005f66;
  --color-sea-serpent-800: #004b50;
  --color-sea-serpent-900: #003b3f;
  --color-sea-serpent-950: #002528;
  --color-orion-nebula: #ad69ff;
  --color-orion-nebula-50: #f9f6ff;
  --color-orion-nebula-100: #f3ecff;
  --color-orion-nebula-200: #e5d6ff;
  --color-orion-nebula-300: #d5bcff;
  --color-orion-nebula-400: #bf93ff;
  --color-orion-nebula-500: #ad69ff;
  --color-orion-nebula-600: #8f49dd;
  --color-orion-nebula-700: #752fbb;
  --color-orion-nebula-800: #5d1a9a;
  --color-orion-nebula-900: #480b7b;
  --color-orion-nebula-950: #2e0252;
  --color-prophet-violet: #6b59ac;
  --color-prophet-violet-50: #f5f4ff;
  --color-prophet-violet-100: #eae7ff;
  --color-prophet-violet-200: #d6d0ff;
  --color-prophet-violet-300: #c0b3ff;
  --color-prophet-violet-400: #a191e6;
  --color-prophet-violet-500: #8574ca;
  --color-prophet-violet-600: #6b59ac;
  --color-prophet-violet-700: #55448e;
  --color-prophet-violet-800: #433374;
  --color-prophet-violet-900: #33265d;
  --color-prophet-violet-950: #20163d;
  --color-beau-vert: #005f65;
  --color-beau-vert-50: #dcfcff;
  --color-beau-vert-100: #c8f5f9;
  --color-beau-vert-200: #ace3e7;
  --color-beau-vert-300: #8ecdd2;
  --color-beau-vert-400: #66aeb4;
  --color-beau-vert-500: #469298;
  --color-beau-vert-600: #2a767c;
  --color-beau-vert-700: #005f65;
  --color-beau-vert-800: #034a4f;
  --color-beau-vert-900: #00393d;
  --color-beau-vert-950: #002427;
  --color-wasabi-nori: #353100;
  --color-wasabi-nori-50: #f8f7dc;
  --color-wasabi-nori-100: #efedcf;
  --color-wasabi-nori-200: #dcdab5;
  --color-wasabi-nori-300: #c6c39a;
  --color-wasabi-nori-400: #a6a376;
  --color-wasabi-nori-500: #8b8759;
  --color-wasabi-nori-600: #706c3f;
  --color-wasabi-nori-700: #58552c;
  --color-wasabi-nori-800: #44411e;
  --color-wasabi-nori-900: #353100;
  --color-wasabi-nori-950: #1f1e08;
}

Similar palettes