# Crimson teal and orange palette

The Crimson teal and orange palette brings together teal, gray, and red. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is teal, and its lightest tone is red.

- Also called: Complementary teal, gray and salmon linear swatches
- Seed: `kYlUKFwyA_jwdwK0G0JNQg4Ne1sw`
- Page: https://grabient.com/kYlUKFwyA_jwdwK0G0JNQg4Ne1sw?style=linearSwatches&steps=6&angle=270
- Drawn as: linear swatches, 6 steps, 270 degrees
- Kinds: vivid, cool
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 2.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 | `#288d86` | `oklch(58.66% 0.0909 187.73)` | Taos Turquoise | black, 5.2 to 1 |
| 2 | `#157b71` | `oklch(52.76% 0.0882 184.56)` | Romantic Isle | white, 5 to 1 |
| 3 | `#006a66` | `oklch(47.24% 0.0813 190.90)` | Chitin Green | white, 6.4 to 1 |
| 4 | `#005460` | `oklch(40.95% 0.0711 211.01)` | Sandalwood Grey Blue | white, 8.5 to 1 |
| 5 | `#455045` | `oklch(41.73% 0.0220 145.46)` | Charcoal Smoke | white, 8.4 to 1 |
| 6 | `#e77656` | `oklch(68.90% 0.1474 36.62)` | Koeksister | black, 7.1 to 1 |

## CSS

```css
background: linear-gradient(270deg, #288d86 0.000% 16.667%, #157b71 16.667% 33.333%, #006a66 33.333% 50.000%, #005460 50.000% 66.667%, #455045 66.667% 83.333%, #e77656 83.333% 100.000%);
background: linear-gradient(270deg, oklch(58.66% 0.0909 187.73) 0.000% 16.667%, oklch(52.76% 0.0882 184.56) 16.667% 33.333%, oklch(47.24% 0.0813 190.90) 33.333% 50.000%, oklch(40.95% 0.0711 211.01) 50.000% 66.667%, oklch(41.73% 0.0220 145.46) 66.667% 83.333%, oklch(68.90% 0.1474 36.62) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.587 | 0.091 | 187.7 |
| 2 | 0.528 | 0.088 | 184.6 |
| 3 | 0.472 | 0.081 | 190.9 |
| 4 | 0.409 | 0.074 | 211 |
| 5 | 0.417 | 0.022 | 145.5 |
| 6 | 0.689 | 0.147 | 36.6 |

## In these collections

- [Teal and orange swatches](https://grabient.com/teal-and-orange-swatches)

## Other forms

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