# Pink and Blue: Turquoise and sky blue

The "Pink and Blue: Turquoise and sky blue" palette brings together teal, light teal, light magenta, and magenta. The colors span a narrow lightness range, combining strong color with gentle contrast. Its light and open character suits travel posters and environmental mood boards. Its darkest tone is magenta, and its lightest tone is light teal.

- Also called: Blue, light blue and pink linear swatches
- Seed: `kWumOgaCk_HGYv7jN9AWFDAg`
- Page: https://grabient.com/kWumOgaCk_HGYv7jN9AWFDAg?style=linearSwatches&steps=5&angle=45
- Drawn as: linear swatches, 5 steps, 45 degrees
- Kinds: vivid
- Hues: complementary
- Contrast of its darkest and lightest colors: 2.2 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 | `#12b9e8` | `oklch(73.23% 0.1364 225.00)` | Cyanite | black, 9.1 to 1 |
| 2 | `#60d6f4` | `oklch(81.89% 0.1130 217.60)` | Heisenberg Blue | black, 12.3 to 1 |
| 3 | `#a9e8f8` | `oklch(89.37% 0.0675 215.49)` | Fresh Air | black, 15.5 to 1 |
| 4 | `#ff8cc2` | `oklch(77.95% 0.1510 351.81)` | Cochonnet | black, 9.7 to 1 |
| 5 | `#ff4f9e` | `oklch(69.29% 0.2215 357.09)` | Pinkella | black, 6.8 to 1 |

## CSS

```css
background: linear-gradient(45deg, #12b9e8 0.000% 20.000%, #60d6f4 20.000% 40.000%, #a9e8f8 40.000% 60.000%, #ff8cc2 60.000% 80.000%, #ff4f9e 80.000% 100.000%);
background: linear-gradient(45deg, oklch(73.23% 0.1364 225.00) 0.000% 20.000%, oklch(81.89% 0.1130 217.60) 20.000% 40.000%, oklch(89.37% 0.0675 215.49) 40.000% 60.000%, oklch(77.95% 0.1510 351.81) 60.000% 80.000%, oklch(69.29% 0.2215 357.09) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.732 | 0.136 | 225 |
| 2 | 0.819 | 0.113 | 217.6 |
| 3 | 0.894 | 0.068 | 215.5 |
| 4 | 0.78 | 0.153 | 351.8 |
| 5 | 0.693 | 0.222 | 357.1 |

## In these collections

- [Pink and blue swatches](https://grabient.com/pink-and-blue-swatches)

## Other forms

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