# Vice City postcard blue

The Vice City postcard: deep sky blue to a pale horizon over turquoise and teal water.

- Also called: Analogous blue, light blue and teal linear gradient
- Seed: `kGS9_0F8wOwdbv9BX9jMEQp6A`
- Page: https://grabient.com/kGS9_0F8wOwdbv9BX9jMEQp6A?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: light center, pastel, cool
- Hues: two-hue
- Contrast of its darkest and lightest colors: 3.4 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 | `#2f7fd0` | `oklch(58.84% 0.1460 252.01)` | Soothing Sapphire | black, 5 to 1 |
| 2 | `#3584d3` | `oklch(60.39% 0.1418 250.98)` | Calgar Blue | black, 5.4 to 1 |
| 3 | `#3c8cd6` | `oklch(62.49% 0.1365 249.71)` | Magical Merlin | black, 5.9 to 1 |
| 4 | `#4694da` | `oklch(64.99% 0.1301 248.20)` | Flax Flower Blue | black, 6.5 to 1 |
| 5 | `#519edf` | `oklch(67.75% 0.1229 246.47)` | Perfect Days | black, 7.2 to 1 |
| 6 | `#5da7e3` | `oklch(70.61% 0.1152 244.51)` | Windjammer | black, 8.1 to 1 |
| 7 | `#68b1e7` | `oklch(73.45% 0.1072 242.33)` | Sanctuary Spa | black, 9 to 1 |
| 8 | `#74baea` | `oklch(76.11% 0.0992 239.94)` | Aero | black, 9.9 to 1 |
| 9 | `#7fc2ec` | `oklch(78.47% 0.0914 237.34)` | Billow | black, 10.8 to 1 |
| 10 | `#8bcaee` | `oklch(80.92% 0.0818 234.38)` | Airy Blue | black, 11.7 to 1 |
| 11 | `#9ad2ef` | `oklch(83.53% 0.0707 231.07)` | Sonic Sky | black, 12.8 to 1 |
| 12 | `#a9daf0` | `oklch(86.13% 0.0590 227.51)` | Mizu Cyan | black, 13.9 to 1 |
| 13 | `#b8e1f1` | `oklch(88.58% 0.0477 223.80)` | Bellagio Fountains | black, 15 to 1 |
| 14 | `#c6e7f2` | `oklch(90.70% 0.0380 220.04)` | Sapphireberry | black, 16 to 1 |
| 15 | `#d0ebf3` | `oklch(92.33% 0.0308 216.33)` | Chalky Blue White | black, 16.8 to 1 |
| 16 | `#d5eef4` | `oklch(93.33% 0.0272 212.76)` | Sparkling River | black, 17.3 to 1 |
| 17 | `#d5eff4` | `oklch(93.53% 0.0284 209.35)` | Frostproof | black, 17.5 to 1 |
| 18 | `#ceeff3` | `oklch(92.93% 0.0350 205.72)` | Diamond League | black, 17.2 to 1 |
| 19 | `#c1edf0` | `oklch(91.68% 0.0456 201.96)` | Icy Breeze | black, 16.6 to 1 |
| 20 | `#b0eaec` | `oklch(89.95% 0.0589 198.22)` | Spearmint Water | black, 15.8 to 1 |
| 21 | `#9de7e6` | `oklch(87.90% 0.0733 194.67)` | Everest | black, 14.9 to 1 |
| 22 | `#88e3de` | `oklch(85.70% 0.0873 191.47)` | Aqua Fiesta | black, 14 to 1 |
| 23 | `#74ded6` | `oklch(83.50% 0.0995 188.79)` | Hammam Blue | black, 13.1 to 1 |
| 24 | `#63d9ce` | `oklch(81.48% 0.1083 186.78)` | Hammam Blue | black, 12.3 to 1 |
| 25 | `#55d4c7` | `oklch(79.59% 0.1132 185.62)` | Jamaican Jade | black, 11.6 to 1 |
| 26 | `#49cec0` | `oklch(77.47% 0.1158 185.28)` | Bianchi Green | black, 10.8 to 1 |
| 27 | `#3ec6b9` | `oklch(75.21% 0.1165 185.57)` | Swimmers Pool | black, 10 to 1 |
| 28 | `#33bfb3` | `oklch(72.91% 0.1160 186.28)` | Tint of Turquoise | black, 9.2 to 1 |
| 29 | `#2ab7ad` | `oklch(70.71% 0.1148 187.23)` | Message Green | black, 8.5 to 1 |
| 30 | `#22b1a8` | `oklch(68.72% 0.1133 188.20)` | Glass Jar Blue | black, 7.8 to 1 |
| 31 | `#19aba3` | `oklch(67.04% 0.1121 189.01)` | Teal Me No Lies | black, 7.4 to 1 |
| 32 | `#10a7a0` | `oklch(65.80% 0.1116 189.46)` | Jadestone | black, 7 to 1 |

## CSS

```css
background: linear-gradient(180deg, #2f7fd0 0.0%, #3584d3 3.2%, #3c8cd6 6.5%, #4694da 9.7%, #519edf 12.9%, #5da7e3 16.1%, #68b1e7 19.4%, #74baea 22.6%, #7fc2ec 25.8%, #8bcaee 29.0%, #9ad2ef 32.3%, #a9daf0 35.5%, #b8e1f1 38.7%, #c6e7f2 41.9%, #d0ebf3 45.2%, #d5eef4 48.4%, #d5eff4 51.6%, #ceeff3 54.8%, #c1edf0 58.1%, #b0eaec 61.3%, #9de7e6 64.5%, #88e3de 67.7%, #74ded6 71.0%, #63d9ce 74.2%, #55d4c7 77.4%, #49cec0 80.6%, #3ec6b9 83.9%, #33bfb3 87.1%, #2ab7ad 90.3%, #22b1a8 93.5%, #19aba3 96.8%, #10a7a0 100.0%);
background: linear-gradient(180deg in oklch, oklch(58.84% 0.1460 252.01) 0.0%, oklch(60.39% 0.1418 250.98) 3.2%, oklch(62.49% 0.1365 249.71) 6.5%, oklch(64.99% 0.1301 248.20) 9.7%, oklch(67.75% 0.1229 246.47) 12.9%, oklch(70.61% 0.1152 244.51) 16.1%, oklch(73.45% 0.1072 242.33) 19.4%, oklch(76.11% 0.0992 239.94) 22.6%, oklch(78.47% 0.0914 237.34) 25.8%, oklch(80.92% 0.0818 234.38) 29.0%, oklch(83.53% 0.0707 231.07) 32.3%, oklch(86.13% 0.0590 227.51) 35.5%, oklch(88.58% 0.0477 223.80) 38.7%, oklch(90.70% 0.0380 220.04) 41.9%, oklch(92.33% 0.0308 216.33) 45.2%, oklch(93.33% 0.0272 212.76) 48.4%, oklch(93.53% 0.0284 209.35) 51.6%, oklch(92.93% 0.0350 205.72) 54.8%, oklch(91.68% 0.0456 201.96) 58.1%, oklch(89.95% 0.0589 198.22) 61.3%, oklch(87.90% 0.0733 194.67) 64.5%, oklch(85.70% 0.0873 191.47) 67.7%, oklch(83.50% 0.0995 188.79) 71.0%, oklch(81.48% 0.1083 186.78) 74.2%, oklch(79.59% 0.1132 185.62) 77.4%, oklch(77.47% 0.1158 185.28) 80.6%, oklch(75.21% 0.1165 185.57) 83.9%, oklch(72.91% 0.1160 186.28) 87.1%, oklch(70.71% 0.1148 187.23) 90.3%, oklch(68.72% 0.1133 188.20) 93.5%, oklch(67.04% 0.1121 189.01) 96.8%, oklch(65.80% 0.1116 189.46) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.588 | 0.146 | 252 |
| 2 | 0.779 | 0.093 | 238 |
| 3 | 0.935 | 0.027 | 211.1 |
| 4 | 0.81 | 0.11 | 186.4 |
| 5 | 0.658 | 0.112 | 189.5 |

## In these collections

- [GTA 6 gradients](https://grabient.com/gta-6-gradients)

## Other forms

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