# Blue and turquoise neon palette

The Blue and turquoise neon palette brings together blue, teal, and light teal. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is blue, and its lightest tone is light teal.

- Also called: Vivid blue and light blue linear swatches
- Seed: `kUdt28SVU_eK2O_2pjxA`
- Page: https://grabient.com/kUdt28SVU_eK2O_2pjxA?style=linearSwatches&steps=4
- Drawn as: linear swatches, 4 steps, 90 degrees
- Kinds: dark to light, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.8 to 1

## Colors

The name most people give each color, and the text color that reads on it with its contrast.

| Stop | Hex | OKLCH | Name | Text on it |
| --- | --- | --- | --- | --- |
| 1 | `#031cff` | `oklch(46.46% 0.3045 264.38)` | Is It Cold | white, 8 to 1 |
| 2 | `#046cff` | `oklch(57.48% 0.2339 260.15)` | Brandeis Blue | black, 4.5 to 1 |
| 3 | `#00c8fe` | `oklch(77.56% 0.1488 226.34)` | Vivid Sky Blue | black, 10.6 to 1 |
| 4 | `#8fffff` | `oklch(93.31% 0.1032 195.68)` | Glitter Shower | black, 17.8 to 1 |

## CSS

```css
background: linear-gradient(90deg, #031cff 0.000% 25.000%, #046cff 25.000% 50.000%, #00c8fe 50.000% 75.000%, #8fffff 75.000% 100.000%);
background: linear-gradient(90deg, oklch(46.46% 0.3045 264.38) 0.000% 25.000%, oklch(57.48% 0.2339 260.15) 25.000% 50.000%, oklch(77.56% 0.1488 226.34) 50.000% 75.000%, oklch(93.31% 0.1032 195.68) 75.000% 100.000%);
```

## Keyframes

4 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.465 | 0.305 | 264.4 |
| 2 | 0.575 | 0.234 | 260.1 |
| 3 | 0.776 | 0.149 | 226.3 |
| 4 | 0.933 | 0.105 | 195.7 |

## In these collections

- [Neon swatches](https://grabient.com/neon-swatches)

## Other forms

- [JSON](https://grabient.com/kUdt28SVU_eK2O_2pjxA.json?style=linearSwatches&steps=4)
- [PNG](https://grabient.com/kUdt28SVU_eK2O_2pjxA.png?style=linearSwatches&steps=4)
- [SVG](https://grabient.com/kUdt28SVU_eK2O_2pjxA.svg?style=linearSwatches&steps=4)
- [CSS](https://grabient.com/kUdt28SVU_eK2O_2pjxA.css?style=linearSwatches&steps=4)
- [ASE](https://grabient.com/kUdt28SVU_eK2O_2pjxA.ase?style=linearSwatches&steps=4)
- [GPL](https://grabient.com/kUdt28SVU_eK2O_2pjxA.gpl?style=linearSwatches&steps=4)
- [GRD](https://grabient.com/kUdt28SVU_eK2O_2pjxA.grd?style=linearSwatches&steps=4)
- [Design tokens](https://grabient.com/kUdt28SVU_eK2O_2pjxA.tokens.json?style=linearSwatches&steps=4)
- [Social card](https://grabient.com/api/og?seed=kUdt28SVU_eK2O_2pjxA&style=linearSwatches&steps=4)
- [Palettes like this one](https://grabient.com/palettes?q=kUdt28SVU_eK2O_2pjxA)
- [Guide for agents](https://grabient.com/llms.txt)