# Teal, ochre and rose summer palette

The Teal, ochre and rose summer palette brings together teal, yellow, and magenta. The colors span a narrow lightness range, combining strong color with gentle contrast. Its light and open character suits seasonal campaigns and event graphics. Its darkest tone is magenta, and its lightest tone is yellow.

- Also called: Vivid tritone teal, yellow and pink angular swatches
- Seed: `kSv4qHcEG1VlMMu`
- Page: https://grabient.com/kSv4qHcEG1VlMMu?style=angularSwatches&steps=3&angle=270
- Drawn as: angular swatches, 3 steps, 270 degrees
- Kinds: vivid, light, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 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 | `#00c8c0` | `oklch(75.20% 0.1299 189.84)` | Swimmers Pool | black, 10 to 1 |
| 2 | `#f4d915` | `oklch(88.19% 0.1805 100.02)` | Yellowl | black, 14.8 to 1 |
| 3 | `#f85ab0` | `oklch(70.08% 0.2094 350.12)` | Pink Katydid | black, 7.1 to 1 |

## CSS

```css
background: conic-gradient(from 270deg, #00c8c0 0.000% 33.333%, #f4d915 33.333% 66.667%, #f85ab0 66.667% 100.000%);
background: conic-gradient(from 270deg, oklch(75.20% 0.1299 189.84) 0.000% 33.333%, oklch(88.19% 0.1805 100.02) 33.333% 66.667%, oklch(70.08% 0.2094 350.12) 66.667% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.752 | 0.19 | 189.8 |
| 2 | 0.882 | 0.181 | 100 |
| 3 | 0.701 | 0.209 | -9.9 |

## In these collections

- [Summer swatches](https://grabient.com/summer-swatches)

## Other forms

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