# Espresso teal and garnet

Near-black espresso brown moves through tobacco, plum and shadowy blue into a broad teal and cyan passage, then returns through blue and violet to dark garnet red. This 64-stop linear gradient balances a long warm shadow with a cool central glow and a restrained red finish, creating a moody multicolor palette.

- Also called: Black, teal, blue and purple linear gradient
- Seed: `kWLQ0aqJNALucqvOIj4N7NUw`
- Page: https://grabient.com/kWLQ0aqJNALucqvOIj4N7NUw?steps=64&angle=75
- Drawn as: linear gradient, 64 steps, 75 degrees
- Kinds: light center, multicolor
- Hues: two-hue
- Contrast of its darkest and lightest colors: 5.2 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 | `#180e0b` | `oklch(17.72% 0.0179 37.27)` | Nuln Oil | white, 18.9 to 1 |
| 2 | `#1a0f0c` | `oklch(18.22% 0.0192 37.68)` | Scandinavian Liquorice | white, 18.7 to 1 |
| 3 | `#1c100d` | `oklch(18.82% 0.0207 38.70)` | Scandinavian Liquorice | white, 18.5 to 1 |
| 4 | `#1e120d` | `oklch(19.52% 0.0224 40.17)` | Bighorn Sheep | white, 18.3 to 1 |
| 5 | `#20130e` | `oklch(20.30% 0.0244 41.98)` | Bighorn Sheep | white, 18 to 1 |
| 6 | `#23150e` | `oklch(21.14% 0.0266 43.96)` | Used Oil | white, 17.7 to 1 |
| 7 | `#26160f` | `oklch(22.05% 0.0289 45.99)` | Used Oil | white, 17.3 to 1 |
| 8 | `#291810` | `oklch(23.00% 0.0313 47.92)` | Tetsu-Guro Black | white, 17 to 1 |
| 9 | `#2c1a10` | `oklch(23.99% 0.0338 49.61)` | Brunneophobia | white, 16.5 to 1 |
| 10 | `#301c11` | `oklch(25.02% 0.0364 50.93)` | Coffee Grounds | white, 16.1 to 1 |
| 11 | `#331f12` | `oklch(26.06% 0.0389 51.74)` | Coffee Grounds | white, 15.6 to 1 |
| 12 | `#372113` | `oklch(27.11% 0.0415 51.89)` | Black Slug | white, 15.1 to 1 |
| 13 | `#3b2314` | `oklch(28.15% 0.0440 51.25)` | Wetlands Swamp | white, 14.6 to 1 |
| 14 | `#3e2516` | `oklch(29.19% 0.0464 49.67)` | Brown Pod | white, 14.2 to 1 |
| 15 | `#422618` | `oklch(30.20% 0.0487 47.02)` | Night Brown | white, 13.7 to 1 |
| 16 | `#46281b` | `oklch(31.18% 0.0509 43.16)` | Night Brown | white, 13.3 to 1 |
| 17 | `#4a291f` | `oklch(32.12% 0.0528 37.92)` | Couch | white, 12.8 to 1 |
| 18 | `#4e2a24` | `oklch(33.05% 0.0548 30.86)` | Bitter Chocolate | white, 12.4 to 1 |
| 19 | `#512b2a` | `oklch(33.99% 0.0566 22.03)` | Heath | white, 12 to 1 |
| 20 | `#542d32` | `oklch(34.93% 0.0585 11.69)` | Port Royale | white, 11.6 to 1 |
| 21 | `#562f3b` | `oklch(35.88% 0.0603 0.10)` | Port Royale | white, 11.2 to 1 |
| 22 | `#573145` | `oklch(36.83% 0.0621 347.52)` | Blackberry Tart | white, 10.8 to 1 |
| 23 | `#563450` | `oklch(37.79% 0.0639 334.22)` | Auricula Purple | white, 10.4 to 1 |
| 24 | `#54385a` | `oklch(38.75% 0.0656 320.46)` | Dark Blackberry | white, 10 to 1 |
| 25 | `#503d63` | `oklch(39.71% 0.0673 306.49)` | Mulberry Purple | white, 9.5 to 1 |
| 26 | `#4b426c` | `oklch(40.66% 0.0689 292.59)` | Izmir Purple | white, 9.1 to 1 |
| 27 | `#444872` | `oklch(41.62% 0.0705 279.01)` | Palace Arms | white, 8.7 to 1 |
| 28 | `#3c4d76` | `oklch(42.58% 0.0721 266.02)` | Takaka | white, 8.3 to 1 |
| 29 | `#335379` | `oklch(43.54% 0.0736 253.88)` | Aerostatics | white, 7.9 to 1 |
| 30 | `#2a587a` | `oklch(44.49% 0.0751 242.85)` | Venice Blue | white, 7.5 to 1 |
| 31 | `#225d7a` | `oklch(45.44% 0.0765 233.19)` | Nautical Creatures | white, 7.1 to 1 |
| 32 | `#1a627a` | `oklch(46.38% 0.0779 225.16)` | Jamaican Dream | white, 6.8 to 1 |
| 33 | `#14667a` | `oklch(47.33% 0.0792 218.84)` | World’s Away | white, 6.5 to 1 |
| 34 | `#116a7a` | `oklch(48.39% 0.0803 213.24)` | Teal With It | white, 6.2 to 1 |
| 35 | `#106e7a` | `oklch(49.53% 0.0812 208.21)` | Carnival Night | white, 5.9 to 1 |
| 36 | `#12737b` | `oklch(50.73% 0.0820 203.76)` | Scurf Green | white, 5.6 to 1 |
| 37 | `#17777c` | `oklch(51.98% 0.0828 199.92)` | Aqua Nation | white, 5.3 to 1 |
| 38 | `#1c7b7d` | `oklch(53.25% 0.0834 196.72)` | Tropical Waters | white, 5 to 1 |
| 39 | `#217f7f` | `oklch(54.50% 0.0840 194.18)` | Jade Jewel | white, 4.7 to 1 |
| 40 | `#258381` | `oklch(55.73% 0.0846 192.31)` | Bayou | black, 4.6 to 1 |
| 41 | `#298783` | `oklch(56.90% 0.0852 191.15)` | Bayou | black, 4.8 to 1 |
| 42 | `#2d8a86` | `oklch(57.99% 0.0859 190.72)` | Taos Turquoise | black, 5.1 to 1 |
| 43 | `#2f8d89` | `oklch(58.97% 0.0867 191.04)` | Taos Turquoise | black, 5.3 to 1 |
| 44 | `#30908d` | `oklch(59.82% 0.0876 192.14)` | Fish Story | black, 5.5 to 1 |
| 45 | `#309291` | `oklch(60.52% 0.0887 194.03)` | Fish Story | black, 5.6 to 1 |
| 46 | `#2f9496` | `oklch(61.03% 0.0900 196.75)` | Sea Fantasy | black, 5.7 to 1 |
| 47 | `#2d959a` | `oklch(61.35% 0.0915 200.31)` | Aqua Lake | black, 5.8 to 1 |
| 48 | `#2b949f` | `oklch(61.43% 0.0932 204.75)` | Aqua Lake | black, 5.8 to 1 |
| 49 | `#2993a4` | `oklch(61.25% 0.0953 210.43)` | Tile Blue | black, 5.8 to 1 |
| 50 | `#2990a9` | `oklch(60.77% 0.0978 218.13)` | Cape Pond | black, 5.6 to 1 |
| 51 | `#2e8caf` | `oklch(60.02% 0.1006 227.59)` | Carol | black, 5.4 to 1 |
| 52 | `#3885b4` | `oklch(59.05% 0.1037 238.53)` | Curious Blue | black, 5.2 to 1 |
| 53 | `#457db7` | `oklch(57.89% 0.1070 250.68)` | Parkwater | black, 4.8 to 1 |
| 54 | `#5474b7` | `oklch(56.58% 0.1105 263.74)` | Diva Violet | white, 4.5 to 1 |
| 55 | `#626ab4` | `oklch(55.15% 0.1140 277.43)` | Loch Ness | white, 4.9 to 1 |
| 56 | `#6f5fac` | `oklch(53.66% 0.1176 291.48)` | Simply Purple | white, 5.3 to 1 |
| 57 | `#7a55a0` | `oklch(52.13% 0.1212 305.59)` | Juneberry | white, 5.7 to 1 |
| 58 | `#834a91` | `oklch(50.61% 0.1247 319.48)` | Voodoo Violet | white, 6.2 to 1 |
| 59 | `#8a4180` | `oklch(49.13% 0.1281 332.88)` | Purpurite Red | white, 6.6 to 1 |
| 60 | `#8e396d` | `oklch(47.72% 0.1312 345.50)` | Powder Red | white, 7.1 to 1 |
| 61 | `#90315a` | `oklch(46.44% 0.1341 357.05)` | Pink Horror | white, 7.5 to 1 |
| 62 | `#912c49` | `oklch(45.32% 0.1366 7.25)` | Scarlet Apple | white, 7.9 to 1 |
| 63 | `#902839` | `oklch(44.39% 0.1388 15.82)` | Thrill Ride | white, 8.2 to 1 |
| 64 | `#8f262b` | `oklch(43.70% 0.1406 22.47)` | Rio Red | white, 8.4 to 1 |

## CSS

```css
background: linear-gradient(75deg, #180e0b 0.0%, #1a0f0c 1.6%, #1c100d 3.2%, #1e120d 4.8%, #20130e 6.3%, #23150e 7.9%, #26160f 9.5%, #291810 11.1%, #2c1a10 12.7%, #301c11 14.3%, #331f12 15.9%, #372113 17.5%, #3b2314 19.0%, #3e2516 20.6%, #422618 22.2%, #46281b 23.8%, #4a291f 25.4%, #4e2a24 27.0%, #512b2a 28.6%, #542d32 30.2%, #562f3b 31.7%, #573145 33.3%, #563450 34.9%, #54385a 36.5%, #503d63 38.1%, #4b426c 39.7%, #444872 41.3%, #3c4d76 42.9%, #335379 44.4%, #2a587a 46.0%, #225d7a 47.6%, #1a627a 49.2%, #14667a 50.8%, #116a7a 52.4%, #106e7a 54.0%, #12737b 55.6%, #17777c 57.1%, #1c7b7d 58.7%, #217f7f 60.3%, #258381 61.9%, #298783 63.5%, #2d8a86 65.1%, #2f8d89 66.7%, #30908d 68.3%, #309291 69.8%, #2f9496 71.4%, #2d959a 73.0%, #2b949f 74.6%, #2993a4 76.2%, #2990a9 77.8%, #2e8caf 79.4%, #3885b4 81.0%, #457db7 82.5%, #5474b7 84.1%, #626ab4 85.7%, #6f5fac 87.3%, #7a55a0 88.9%, #834a91 90.5%, #8a4180 92.1%, #8e396d 93.7%, #90315a 95.2%, #912c49 96.8%, #902839 98.4%, #8f262b 100.0%);
background: linear-gradient(75deg in oklch, oklch(17.72% 0.0179 37.27) 0.0%, oklch(18.22% 0.0192 37.68) 1.6%, oklch(18.82% 0.0207 38.70) 3.2%, oklch(19.52% 0.0224 40.17) 4.8%, oklch(20.30% 0.0244 41.98) 6.3%, oklch(21.14% 0.0266 43.96) 7.9%, oklch(22.05% 0.0289 45.99) 9.5%, oklch(23.00% 0.0313 47.92) 11.1%, oklch(23.99% 0.0338 49.61) 12.7%, oklch(25.02% 0.0364 50.93) 14.3%, oklch(26.06% 0.0389 51.74) 15.9%, oklch(27.11% 0.0415 51.89) 17.5%, oklch(28.15% 0.0440 51.25) 19.0%, oklch(29.19% 0.0464 49.67) 20.6%, oklch(30.20% 0.0487 47.02) 22.2%, oklch(31.18% 0.0509 43.16) 23.8%, oklch(32.12% 0.0528 37.92) 25.4%, oklch(33.05% 0.0548 30.86) 27.0%, oklch(33.99% 0.0566 22.03) 28.6%, oklch(34.93% 0.0585 11.69) 30.2%, oklch(35.88% 0.0603 0.10) 31.7%, oklch(36.83% 0.0621 347.52) 33.3%, oklch(37.79% 0.0639 334.22) 34.9%, oklch(38.75% 0.0656 320.46) 36.5%, oklch(39.71% 0.0673 306.49) 38.1%, oklch(40.66% 0.0689 292.59) 39.7%, oklch(41.62% 0.0705 279.01) 41.3%, oklch(42.58% 0.0721 266.02) 42.9%, oklch(43.54% 0.0736 253.88) 44.4%, oklch(44.49% 0.0751 242.85) 46.0%, oklch(45.44% 0.0765 233.19) 47.6%, oklch(46.38% 0.0779 225.16) 49.2%, oklch(47.33% 0.0792 218.84) 50.8%, oklch(48.39% 0.0803 213.24) 52.4%, oklch(49.53% 0.0812 208.21) 54.0%, oklch(50.73% 0.0820 203.76) 55.6%, oklch(51.98% 0.0828 199.92) 57.1%, oklch(53.25% 0.0834 196.72) 58.7%, oklch(54.50% 0.0840 194.18) 60.3%, oklch(55.73% 0.0846 192.31) 61.9%, oklch(56.90% 0.0852 191.15) 63.5%, oklch(57.99% 0.0859 190.72) 65.1%, oklch(58.97% 0.0867 191.04) 66.7%, oklch(59.82% 0.0876 192.14) 68.3%, oklch(60.52% 0.0887 194.03) 69.8%, oklch(61.03% 0.0900 196.75) 71.4%, oklch(61.35% 0.0915 200.31) 73.0%, oklch(61.43% 0.0932 204.75) 74.6%, oklch(61.25% 0.0953 210.43) 76.2%, oklch(60.77% 0.0978 218.13) 77.8%, oklch(60.02% 0.1006 227.59) 79.4%, oklch(59.05% 0.1037 238.53) 81.0%, oklch(57.89% 0.1070 250.68) 82.5%, oklch(56.58% 0.1105 263.74) 84.1%, oklch(55.15% 0.1140 277.43) 85.7%, oklch(53.66% 0.1176 291.48) 87.3%, oklch(52.13% 0.1212 305.59) 88.9%, oklch(50.61% 0.1247 319.48) 90.5%, oklch(49.13% 0.1281 332.88) 92.1%, oklch(47.72% 0.1312 345.50) 93.7%, oklch(46.44% 0.1341 357.05) 95.2%, oklch(45.32% 0.1366 7.25) 96.8%, oklch(44.39% 0.1388 15.82) 98.4%, oklch(43.70% 0.1406 22.47) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.177 | 0.018 | 37.3 |
| 2 | 0.319 | 0.052 | 39.4 |
| 3 | 0.469 | 0.079 | -138.2 |
| 4 | 0.614 | 0.094 | -154 |
| 5 | 0.437 | 0.141 | 22.5 |

## In these collections

- [Dark multicolor gradients](https://grabient.com/dark-multicolor-gradients)

## Other forms

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