Telemagenta to Pristine Oceanic color palette

A930C5Telemagenta 0075EBDeep Sky Blue FF215BGolden Blood 4FABFFCerulean FF74DANervous Neon Pink 00CFCFPristine Oceanic

Open in generator Export PNG, PDF, ASE…

About this palette

Telemagenta to Pristine Oceanic is a 6-color vibrant, cool, neon palette: #A930C5 (Telemagenta), #0075EB (Deep Sky Blue), #FF215B (Golden Blood), #4FABFF (Cerulean), #FF74DA (Nervous Neon Pink), #00CFCF (Pristine Oceanic). It mixes purple, blue, red, pink, turquoise tones and feels cool overall. The strongest text pairing is #A930C5 on #00CFCF with a contrast ratio of 2.76:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Telemagenta	rgb(169, 48, 197)	hsl(289, 61%, 48%)
Deep Sky Blue	rgb(0, 117, 235)	hsl(210, 100%, 46%)
Golden Blood	rgb(255, 33, 91)	hsl(344, 100%, 56%)
Cerulean	rgb(79, 171, 255)	hsl(209, 100%, 65%)
Nervous Neon Pink	rgb(255, 116, 218)	hsl(316, 100%, 73%)
Pristine Oceanic	rgb(0, 207, 207)	hsl(180, 100%, 41%)

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

/* Telemagenta to Pristine Oceanic — https://swatchly.xyz/palette/a930c5-0075eb-ff215b-4fabff-ff74da-00cfcf */
:root {
  --telemagenta: #a930c5;
  --deep-sky-blue: #0075eb;
  --golden-blood: #ff215b;
  --cerulean: #4fabff;
  --nervous-neon-pink: #ff74da;
  --pristine-oceanic: #00cfcf;
}

Tailwind CSS v4

/* Telemagenta to Pristine Oceanic — https://swatchly.xyz/palette/a930c5-0075eb-ff215b-4fabff-ff74da-00cfcf */
@theme {
  --color-telemagenta: #a930c5;
  --color-telemagenta-50: #fcf1ff;
  --color-telemagenta-100: #f9e4ff;
  --color-telemagenta-200: #f4c9ff;
  --color-telemagenta-300: #eda6ff;
  --color-telemagenta-400: #df71fb;
  --color-telemagenta-500: #c550e1;
  --color-telemagenta-600: #a930c5;
  --color-telemagenta-700: #8b12a5;
  --color-telemagenta-800: #700086;
  --color-telemagenta-900: #570068;
  --color-telemagenta-950: #380044;
  --color-deep-sky-blue: #0075eb;
  --color-deep-sky-blue-50: #ebf4ff;
  --color-deep-sky-blue-100: #d7e8ff;
  --color-deep-sky-blue-200: #b3d3ff;
  --color-deep-sky-blue-300: #88baff;
  --color-deep-sky-blue-400: #4596ff;
  --color-deep-sky-blue-500: #0075eb;
  --color-deep-sky-blue-600: #005ebf;
  --color-deep-sky-blue-700: #004a9a;
  --color-deep-sky-blue-800: #003a7c;
  --color-deep-sky-blue-900: #002d63;
  --color-deep-sky-blue-950: #001c42;
  --color-golden-blood: #ff215b;
  --color-golden-blood-50: #fff3f4;
  --color-golden-blood-100: #ffe7e8;
  --color-golden-blood-200: #ffcdcf;
  --color-golden-blood-300: #ffacb2;
  --color-golden-blood-400: #ff7585;
  --color-golden-blood-500: #ff215b;
  --color-golden-blood-600: #d30046;
  --color-golden-blood-700: #a90036;
  --color-golden-blood-800: #850029;
  --color-golden-blood-900: #68001e;
  --color-golden-blood-950: #430010;
  --color-cerulean: #4fabff;
  --color-cerulean-50: #f0f7ff;
  --color-cerulean-100: #e0efff;
  --color-cerulean-200: #bedeff;
  --color-cerulean-300: #94caff;
  --color-cerulean-400: #4fabff;
  --color-cerulean-500: #2f8edf;
  --color-cerulean-600: #0071bf;
  --color-cerulean-700: #005999;
  --color-cerulean-800: #004579;
  --color-cerulean-900: #00355e;
  --color-cerulean-950: #00203d;
  --color-nervous-neon-pink: #ff74da;
  --color-nervous-neon-pink-50: #fff8fc;
  --color-nervous-neon-pink-100: #ffedf8;
  --color-nervous-neon-pink-200: #ffd2f0;
  --color-nervous-neon-pink-300: #ffb0e6;
  --color-nervous-neon-pink-400: #ff74da;
  --color-nervous-neon-pink-500: #dc55ba;
  --color-nervous-neon-pink-600: #ba339b;
  --color-nervous-neon-pink-700: #9a157e;
  --color-nervous-neon-pink-800: #7b0064;
  --color-nervous-neon-pink-900: #5f004c;
  --color-nervous-neon-pink-950: #3c002f;
  --color-pristine-oceanic: #00cfcf;
  --color-pristine-oceanic-50: #b6fffe;
  --color-pristine-oceanic-100: #99f6f5;
  --color-pristine-oceanic-200: #70e3e3;
  --color-pristine-oceanic-300: #00cfcf;
  --color-pristine-oceanic-400: #00aeae;
  --color-pristine-oceanic-500: #009191;
  --color-pristine-oceanic-600: #007676;
  --color-pristine-oceanic-700: #005e5e;
  --color-pristine-oceanic-800: #004b4b;
  --color-pristine-oceanic-900: #003b3b;
  --color-pristine-oceanic-950: #002525;
}