# Deep cyan and ochre tropical palette

The Deep cyan and ochre tropical palette brings together teal, yellow, orange, and gold. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is teal, and its lightest tone is yellow.

- Also called: Teal, yellow, orange and brown angular swatches
- Seed: `kWeziQ2ye_PE3NFit70SCFB4`
- Page: https://grabient.com/kWeziQ2ye_PE3NFit70SCFB4?style=angularSwatches&steps=5&angle=225
- Drawn as: angular swatches, 5 steps, 225 degrees
- Kinds: light center, pastel
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 4.4 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 | `#146b72` | `oklch(48.43% 0.0772 203.20)` | Toadstool Teal | white, 6.1 to 1 |
| 2 | `#36b8bb` | `oklch(71.65% 0.1089 196.86)` | Montego Bay | black, 8.7 to 1 |
| 3 | `#f4dc57` | `oklch(88.98% 0.1516 98.58)` | Tamarack Yellow | black, 15.1 to 1 |
| 4 | `#efa52a` | `oklch(77.56% 0.1530 74.28)` | Orange Pospsicle | black, 10 to 1 |
| 5 | `#8a7430` | `oklch(56.69% 0.0909 91.19)` | Jumping Juniper | black, 4.6 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #146b72 0.000% 20.000%, #36b8bb 20.000% 40.000%, #f4dc57 40.000% 60.000%, #efa52a 60.000% 80.000%, #8a7430 80.000% 100.000%);
background: conic-gradient(from 225deg, oklch(48.43% 0.0772 203.20) 0.000% 20.000%, oklch(71.65% 0.1089 196.86) 20.000% 40.000%, oklch(88.98% 0.1516 98.58) 40.000% 60.000%, oklch(77.56% 0.1530 74.28) 60.000% 80.000%, oklch(56.69% 0.0909 91.19) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.484 | 0.077 | 203.2 |
| 2 | 0.717 | 0.109 | 196.9 |
| 3 | 0.89 | 0.152 | 98.6 |
| 4 | 0.776 | 0.153 | 74.3 |
| 5 | 0.567 | 0.091 | 91.2 |

## In these collections

- [Tropical swatches](https://grabient.com/tropical-swatches)

## Other forms

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