neondarkcool
Neon Tokyo Color Palette
Neon Tokyo is a neon, dark and cool color palette of 5 colors: Oxford Blue (#0f0f1a), Rose (#ff2a6d), Dark Turquoise (#05d9e8), Light Cyan (#d1f7ff) and Petrol (#005678). Its dominant hue is blue.
The darkest color, Oxford Blue, on the lightest, Light Cyan, gives a 16.72:1 contrast ratio — enough for body text at WCAG AAA. 5 pairs in this palette pass AA for normal text. Rose (#ff2a6d) is its most saturated color and a natural choice for buttons and links.
Colors
- Oxford Blue
- Rose
- Dark Turquoise
- Light Cyan
- Petrol
CSS Output
:root {
--neon-tokyo-1: #0f0f1a;
--neon-tokyo-2: #ff2a6d;
--neon-tokyo-3: #05d9e8;
--neon-tokyo-4: #d1f7ff;
--neon-tokyo-5: #005678;
}Neon Tokyo on a Website
A quick preview on a landing page: the most colorful colors become the primary and accent, a light one the surface. For a more realistic look across many designs, open it in the Palette Visualizer below.
See it on real designs
This is a single preview. The Palette Visualizer shows the palette on 11 designs — dashboards, mobile apps, pricing and blog pages, posters and business cards — lets you change which color plays which role, switch to dark mode and check contrast.
Accessible Color Combinations
Pairs from this palette that work as text on a background, with their WCAG contrast ratio. AA needs 4.5:1 for body text; large text needs 3:1.
- Oxford Blue on Light Cyan#0f0f1a on #d1f7ff16.72:1AAA
- Oxford Blue on Dark Turquoise#0f0f1a on #05d9e810.96:1AAA
- Petrol on Light Cyan#005678 on #d1f7ff7.09:1AAA
- Oxford Blue on Rose#0f0f1a on #ff2a6d5.25:1AA
- Petrol on Dark Turquoise#005678 on #05d9e84.64:1AA
- Rose on Light Cyan#ff2a6d on #d1f7ff3.18:1AA Large