# Mint and teal color palette

The Mint and teal color palette brings together pale green and teal. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its light and open character suits seasonal campaigns and event graphics. Its darkest tone is teal, and its lightest tone is pale green.

- Also called: Pastel analogous green, teal and blue linear gradient
- Seed: `kS6mNlaDDE1utw6`
- Page: https://grabient.com/kS6mNlaDDE1utw6?angle=270
- Drawn as: linear gradient, 7 steps, 270 degrees
- Kinds: pastel, light, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.9 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 | `#affca7` | `oklch(92.13% 0.1364 142.03)` | Light Pastel Green | black, 17.3 to 1 |
| 2 | `#91f6b1` | `oklch(89.46% 0.1359 153.07)` | Tenacious Tentacles | black, 16 to 1 |
| 3 | `#65ecc0` | `oklch(85.65% 0.1351 168.68)` | Onsen | black, 14.3 to 1 |
| 4 | `#3ae0cc` | `oklch(81.89% 0.1337 183.24)` | Fresh Turquoise | black, 12.6 to 1 |
| 5 | `#16d1d3` | `oklch(78.22% 0.1310 195.69)` | Jade Glass | black, 11.1 to 1 |
| 6 | `#02c3d5` | `oklch(74.58% 0.1277 207.08)` | The Crowd Roars! | black, 9.7 to 1 |
| 7 | `#10b8d5` | `oklch(72.05% 0.1254 214.95)` | Ocean Sigh | black, 8.8 to 1 |

## CSS

```css
background: linear-gradient(270deg, #affca7 0.0%, #91f6b1 16.7%, #65ecc0 33.3%, #3ae0cc 50.0%, #16d1d3 66.7%, #02c3d5 83.3%, #10b8d5 100.0%);
background: linear-gradient(270deg in oklch, oklch(92.13% 0.1364 142.03) 0.0%, oklch(89.46% 0.1359 153.07) 16.7%, oklch(85.65% 0.1351 168.68) 33.3%, oklch(81.89% 0.1337 183.24) 50.0%, oklch(78.22% 0.1310 195.69) 66.7%, oklch(74.58% 0.1277 207.08) 83.3%, oklch(72.05% 0.1254 214.95) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.921 | 0.136 | 142 |
| 2 | 0.819 | 0.134 | 183.2 |
| 3 | 0.72 | 0.125 | 214.9 |

## In these collections

- [Spring gradients](https://grabient.com/spring-gradients)
- [Light multicolor gradients](https://grabient.com/light-multicolor-gradients)

## Other forms

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