# Teal and indigo electric blue palette

The Teal and indigo electric blue palette brings together teal and blue. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is teal.

- Also called: Vivid analogous cyan to blue linear gradient
- Seed: `kaz2ib9LY8_K4QFwssCTsnG7xuwO7bj_g`
- Page: https://grabient.com/kaz2ib9LY8_K4QFwssCTsnG7xuwO7bj_g?angle=225
- Drawn as: linear gradient, 7 steps, 225 degrees
- Kinds: light center, vivid, light, cool
- Hues: two-hue
- Contrast of its darkest and lightest colors: 6.6 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 | `#2bd7ff` | `oklch(81.50% 0.1398 218.67)` | Neon Blue | black, 12.2 to 1 |
| 2 | `#62fffc` | `oklch(91.73% 0.1307 193.32)` | Moonglade Water | black, 17.2 to 1 |
| 3 | `#30fcff` | `oklch(90.16% 0.1468 196.47)` | Bright Cyan | black, 16.4 to 1 |
| 4 | `#49f3ff` | `oklch(88.58% 0.1351 201.76)` | Frozen Turquoise | black, 15.6 to 1 |
| 5 | `#377efd` | `oklch(61.81% 0.2026 260.94)` | Ceruleite | black, 5.5 to 1 |
| 6 | `#2e17ff` | `oklch(47.24% 0.2995 269.40)` | Blue Pencil | white, 7.8 to 1 |
| 7 | `#2d07fe` | `oklch(46.46% 0.3031 269.40)` | Blue Pencil | white, 8.1 to 1 |

## CSS

```css
background: linear-gradient(225deg, #2bd7ff 0.0%, #62fffc 16.7%, #30fcff 33.3%, #49f3ff 50.0%, #377efd 66.7%, #2e17ff 83.3%, #2d07fe 100.0%);
background: linear-gradient(225deg in oklch, oklch(81.50% 0.1398 218.67) 0.0%, oklch(91.73% 0.1307 193.32) 16.7%, oklch(90.16% 0.1468 196.47) 33.3%, oklch(88.58% 0.1351 201.76) 50.0%, oklch(61.81% 0.2026 260.94) 66.7%, oklch(47.24% 0.2995 269.40) 83.3%, oklch(46.46% 0.3031 269.40) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.815 | 0.143 | 218.7 |
| 2 | 0.917 | 0.149 | 193.3 |
| 3 | 0.902 | 0.154 | 196.5 |
| 4 | 0.886 | 0.139 | 201.8 |
| 5 | 0.618 | 0.203 | 260.9 |
| 6 | 0.472 | 0.305 | 269.4 |
| 7 | 0.465 | 0.303 | 269.4 |

## In these collections

- [Electric blue gradients](https://grabient.com/electric-blue-gradients)

## Other forms

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