# Coral, stone and teal hero section palette

The Coral, stone and teal hero section palette brings together light red, light orange, light green, and teal. The colors span a narrow lightness range, combining restrained color with gentle contrast. Its light and open character suits website sections and interface mockups. Its darkest tone is teal, and its lightest tone is light orange.

- Also called: Complementary pink, gray and teal linear gradient
- Seed: `kUujgS6o5FmqQSrXG0Gg`
- Page: https://grabient.com/kUujgS6o5FmqQSrXG0Gg?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: pastel, light, multicolor
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 1.7 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 | `#d5968f` | `oklch(73.23% 0.0772 26.02)` | Powder Blush | black, 8.5 to 1 |
| 2 | `#d69990` | `oklch(73.88% 0.0748 28.56)` | Shanghai Peach | black, 8.8 to 1 |
| 3 | `#d79d91` | `oklch(74.78% 0.0715 31.57)` | Shanghai Peach | black, 9.1 to 1 |
| 4 | `#d8a294` | `oklch(75.86% 0.0675 35.05)` | Auburn Wave | black, 9.4 to 1 |
| 5 | `#d9a797` | `oklch(77.06% 0.0630 38.98)` | Cottage Rose | black, 9.9 to 1 |
| 6 | `#daad9b` | `oklch(78.33% 0.0583 43.34)` | Montezuma’s Castle | black, 10.4 to 1 |
| 7 | `#dab39f` | `oklch(79.61% 0.0536 48.14)` | Spanish Villa | black, 10.9 to 1 |
| 8 | `#dbb8a3` | `oklch(80.84% 0.0491 53.35)` | Camel Hair | black, 11.4 to 1 |
| 9 | `#dbbea8` | `oklch(81.97% 0.0451 58.96)` | Tagsale Linen | black, 11.9 to 1 |
| 10 | `#dbc2ab` | `oklch(82.93% 0.0417 64.97)` | Old Bone | black, 12.3 to 1 |
| 11 | `#dac6ae` | `oklch(83.67% 0.0392 71.36)` | Tres Naturale | black, 12.6 to 1 |
| 12 | `#d9c9b0` | `oklch(84.19% 0.0376 78.36)` | Raw Sugar | black, 12.9 to 1 |
| 13 | `#d7ccb2` | `oklch(84.63% 0.0367 86.60)` | Vanderbilt Beach | black, 13.1 to 1 |
| 14 | `#d5ceb4` | `oklch(84.99% 0.0363 95.82)` | Ecru Wealth | black, 13.3 to 1 |
| 15 | `#d1d1b6` | `oklch(85.27% 0.0363 105.71)` | Breathe | black, 13.4 to 1 |
| 16 | `#cdd3b8` | `oklch(85.44% 0.0367 115.93)` | Aloe Wash | black, 13.5 to 1 |
| 17 | `#c9d4ba` | `oklch(85.50% 0.0375 126.15)` | Willow Tree Mouse | black, 13.6 to 1 |
| 18 | `#c4d5bd` | `oklch(85.42% 0.0385 136.06)` | Surf Crest | black, 13.6 to 1 |
| 19 | `#bfd6bf` | `oklch(85.21% 0.0398 145.33)` | Namaste | black, 13.5 to 1 |
| 20 | `#bad6c1` | `oklch(84.85% 0.0413 153.64)` | Reclining Green | black, 13.4 to 1 |
| 21 | `#b4d5c2` | `oklch(84.31% 0.0430 160.65)` | Chlorophyll Cream | black, 13.2 to 1 |
| 22 | `#afd3c3` | `oklch(83.59% 0.0447 166.08)` | Feeling Lucky | black, 12.9 to 1 |
| 23 | `#a8d0c1` | `oklch(82.52% 0.0470 170.19)` | Swimming Pool Green | black, 12.4 to 1 |
| 24 | `#a1ccbe` | `oklch(81.13% 0.0499 173.23)` | Tareyton | black, 11.9 to 1 |
| 25 | `#99c8ba` | `oklch(79.50% 0.0531 175.38)` | Cool Juniper | black, 11.3 to 1 |
| 26 | `#90c3b6` | `oklch(77.72% 0.0566 176.79)` | Catarina Green | black, 10.6 to 1 |
| 27 | `#87beb0` | `oklch(75.87% 0.0602 177.64)` | Mild Evergreen | black, 10 to 1 |
| 28 | `#7eb9ab` | `oklch(74.04% 0.0637 178.09)` | Winter Surf | black, 9.3 to 1 |
| 29 | `#76b4a6` | `oklch(72.30% 0.0671 178.31)` | Intracoastal | black, 8.8 to 1 |
| 30 | `#6fafa1` | `oklch(70.74% 0.0701 178.46)` | Turquoise Fantasies | black, 8.3 to 1 |
| 31 | `#68ac9d` | `oklch(69.45% 0.0726 178.72)` | Green Crush | black, 7.9 to 1 |
| 32 | `#63a99b` | `oklch(68.50% 0.0744 179.24)` | Dragon Bay | black, 7.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #d5968f 0.0%, #d69990 3.2%, #d79d91 6.5%, #d8a294 9.7%, #d9a797 12.9%, #daad9b 16.1%, #dab39f 19.4%, #dbb8a3 22.6%, #dbbea8 25.8%, #dbc2ab 29.0%, #dac6ae 32.3%, #d9c9b0 35.5%, #d7ccb2 38.7%, #d5ceb4 41.9%, #d1d1b6 45.2%, #cdd3b8 48.4%, #c9d4ba 51.6%, #c4d5bd 54.8%, #bfd6bf 58.1%, #bad6c1 61.3%, #b4d5c2 64.5%, #afd3c3 67.7%, #a8d0c1 71.0%, #a1ccbe 74.2%, #99c8ba 77.4%, #90c3b6 80.6%, #87beb0 83.9%, #7eb9ab 87.1%, #76b4a6 90.3%, #6fafa1 93.5%, #68ac9d 96.8%, #63a99b 100.0%);
background: linear-gradient(90deg in oklch, oklch(73.23% 0.0772 26.02) 0.0%, oklch(73.88% 0.0748 28.56) 3.2%, oklch(74.78% 0.0715 31.57) 6.5%, oklch(75.86% 0.0675 35.05) 9.7%, oklch(77.06% 0.0630 38.98) 12.9%, oklch(78.33% 0.0583 43.34) 16.1%, oklch(79.61% 0.0536 48.14) 19.4%, oklch(80.84% 0.0491 53.35) 22.6%, oklch(81.97% 0.0451 58.96) 25.8%, oklch(82.93% 0.0417 64.97) 29.0%, oklch(83.67% 0.0392 71.36) 32.3%, oklch(84.19% 0.0376 78.36) 35.5%, oklch(84.63% 0.0367 86.60) 38.7%, oklch(84.99% 0.0363 95.82) 41.9%, oklch(85.27% 0.0363 105.71) 45.2%, oklch(85.44% 0.0367 115.93) 48.4%, oklch(85.50% 0.0375 126.15) 51.6%, oklch(85.42% 0.0385 136.06) 54.8%, oklch(85.21% 0.0398 145.33) 58.1%, oklch(84.85% 0.0413 153.64) 61.3%, oklch(84.31% 0.0430 160.65) 64.5%, oklch(83.59% 0.0447 166.08) 67.7%, oklch(82.52% 0.0470 170.19) 71.0%, oklch(81.13% 0.0499 173.23) 74.2%, oklch(79.50% 0.0531 175.38) 77.4%, oklch(77.72% 0.0566 176.79) 80.6%, oklch(75.87% 0.0602 177.64) 83.9%, oklch(74.04% 0.0637 178.09) 87.1%, oklch(72.30% 0.0671 178.31) 90.3%, oklch(70.74% 0.0701 178.46) 93.5%, oklch(69.45% 0.0726 178.72) 96.8%, oklch(68.50% 0.0744 179.24) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.732 | 0.077 | 26 |
| 2 | 0.839 | 0.039 | 73.6 |
| 3 | 0.839 | 0.044 | 164.5 |
| 4 | 0.685 | 0.074 | 179.2 |

## In these collections

- [Hero section gradients](https://grabient.com/hero-section-gradients)

## Other forms

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