# Teal and gold color palette

The Teal and gold color palette brings together green and gold. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is green, and its lightest tone is gold.

- Also called: Green, tan and dark green angular swatches
- Seed: `kYeEV0UyM9-8gujeLj7Qh9DywRxi`
- Page: https://grabient.com/kYeEV0UyM9-8gujeLj7Qh9DywRxi?style=angularSwatches&steps=6&angle=45
- Drawn as: angular swatches, 6 steps, 45 degrees
- Kinds: light center
- Hues: analogous
- Contrast of its darkest and lightest colors: 7.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 | `#136c4c` | `oklch(47.24% 0.0951 163.12)` | Into the Green | white, 6.4 to 1 |
| 2 | `#68a06c` | `oklch(65.35% 0.0965 146.22)` | Treelet | black, 6.8 to 1 |
| 3 | `#e5d792` | `oklch(87.40% 0.0896 97.61)` | Pineapple Slice | black, 14.4 to 1 |
| 4 | `#cca63f` | `oklch(74.02% 0.1268 88.10)` | Aniseed | black, 9 to 1 |
| 5 | `#627035` | `oklch(51.97% 0.0854 120.85)` | Venom Wyrm | white, 5.3 to 1 |
| 6 | `#1b4237` | `oklch(34.65% 0.0482 173.69)` | Black Soap | white, 11.1 to 1 |

## CSS

```css
background: conic-gradient(from 45deg, #136c4c 0.000% 16.667%, #68a06c 16.667% 33.333%, #e5d792 33.333% 50.000%, #cca63f 50.000% 66.667%, #627035 66.667% 83.333%, #1b4237 83.333% 100.000%);
background: conic-gradient(from 45deg, oklch(47.24% 0.0951 163.12) 0.000% 16.667%, oklch(65.35% 0.0965 146.22) 16.667% 33.333%, oklch(87.40% 0.0896 97.61) 33.333% 50.000%, oklch(74.02% 0.1268 88.10) 50.000% 66.667%, oklch(51.97% 0.0854 120.85) 66.667% 83.333%, oklch(34.65% 0.0482 173.69) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.472 | 0.095 | 163.1 |
| 2 | 0.654 | 0.096 | 146.2 |
| 3 | 0.874 | 0.09 | 97.6 |
| 4 | 0.74 | 0.127 | 88.1 |
| 5 | 0.52 | 0.085 | 120.9 |
| 6 | 0.346 | 0.048 | 173.7 |

## In these collections

- [Green and gold](https://grabient.com/green-and-gold)
- [Green and gold swatches](https://grabient.com/green-and-gold-swatches)

## Other forms

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