# Teal and tan color palette

The Teal and tan color palette brings together blue, teal, yellow, orange, and gray. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits invitation suites and ceremony stationery. Its darkest tone is gray, and its lightest tone is yellow.

- Also called: Seamless blue, teal and gray linear swatches
- Seed: `kYkTWl2hS7N0VNpNETvvwUsMgeOu`
- Page: https://grabient.com/kYkTWl2hS7N0VNpNETvvwUsMgeOu?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: muted, seamless
- Hues: two-hue
- Contrast of its darkest and lightest colors: 2.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 | `#487f9c` | `oklch(57.09% 0.0730 232.73)` | Flattering Blue | black, 4.8 to 1 |
| 2 | `#77adaa` | `oklch(70.87% 0.0565 192.58)` | Solution | black, 8.3 to 1 |
| 3 | `#a8ad83` | `oklch(73.23% 0.0579 113.32)` | Wall Green | black, 8.9 to 1 |
| 4 | `#917f62` | `oklch(60.63% 0.0469 79.51)` | Woolly Thyme | black, 5.4 to 1 |
| 5 | `#5f626a` | `oklch(49.61% 0.0138 272.54)` | Script Ink | white, 6.1 to 1 |
| 6 | `#3c7f9e` | `oklch(56.69% 0.0827 230.27)` | Greenland Blue | black, 4.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #487f9c 0.000% 16.667%, #77adaa 16.667% 33.333%, #a8ad83 33.333% 50.000%, #917f62 50.000% 66.667%, #5f626a 66.667% 83.333%, #3c7f9e 83.333% 100.000%);
background: linear-gradient(90deg, oklch(57.09% 0.0730 232.73) 0.000% 16.667%, oklch(70.87% 0.0565 192.58) 16.667% 33.333%, oklch(73.23% 0.0579 113.32) 33.333% 50.000%, oklch(60.63% 0.0469 79.51) 50.000% 66.667%, oklch(49.61% 0.0138 272.54) 66.667% 83.333%, oklch(56.69% 0.0827 230.27) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.571 | 0.073 | 232.7 |
| 2 | 0.709 | 0.056 | 192.6 |
| 3 | 0.732 | 0.058 | 113.3 |
| 4 | 0.606 | 0.047 | 79.5 |
| 5 | 0.496 | 0.014 | -87.5 |
| 6 | 0.567 | 0.083 | -129.7 |

## In these collections

- [Dusty blue bridal flowers](https://grabient.com/dusty-blue-bridal-flowers)
- [Soft swatches](https://grabient.com/soft-swatches)
- [Dusty swatches](https://grabient.com/dusty-swatches)
- [Elegant swatches](https://grabient.com/elegant-swatches)

## Other forms

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