# Teal navy tan radial fan

Brown, gray, navy and black angular swatches with 34 colors: #8b715a, #89735a, #86775b, #817b5f, #7c8065, #76846c, #718673, #6d887a, #69887f, #638781, #5d8583, #558384, #4b8184, #417e84, #357a84, #297583, #1d7081, #136a7f, #09637b, #025b76, #005370, #004a69, #004262, #003a5a, #003152, #002a4b, #002142, #001939, #00112f, #000926, #00031e, #000017, #00000f, #000008. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Brown, gray, navy and black angular swatches
- Seed: `kWkCIrzA5Nr8dxIkHEOBxVCY`
- Page: https://grabient.com/kWkCIrzA5Nr8dxIkHEOBxVCY?style=angularSwatches&steps=34
- Drawn as: angular swatches, 34 steps, 90 degrees
- Kinds: light to dark, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#8b715a` | `oklch(56.69% 0.0469 61.17)` | Sweet Georgia Brown | black, 4.5 to 1 |
| 2 | `#89735a` | `oklch(57.01% 0.0459 70.32)` | Verde Marrón | black, 4.6 to 1 |
| 3 | `#86775b` | `oklch(57.54% 0.0443 82.98)` | Brownish Grey | black, 4.7 to 1 |
| 4 | `#817b5f` | `oklch(58.17% 0.0423 98.13)` | Thurman | black, 4.9 to 1 |
| 5 | `#7c8065` | `oklch(58.83% 0.0403 114.72)` | Pendula Garden | black, 5.1 to 1 |
| 6 | `#76846c` | `oklch(59.42% 0.0385 131.74)` | Wreath | black, 5.2 to 1 |
| 7 | `#718673` | `oklch(59.86% 0.0374 148.13)` | Thyme and Place | black, 5.3 to 1 |
| 8 | `#6d887a` | `oklch(60.06% 0.0371 162.88)` | Hanging Vine | black, 5.4 to 1 |
| 9 | `#69887f` | `oklch(59.94% 0.0381 174.94)` | Marsh Creek | black, 5.4 to 1 |
| 10 | `#638781` | `oklch(59.46% 0.0407 183.90)` | Marsh Creek | black, 5.3 to 1 |
| 11 | `#5d8583` | `oklch(58.75% 0.0451 190.94)` | Cretan Green | black, 5.1 to 1 |
| 12 | `#558384` | `oklch(57.83% 0.0508 196.48)` | Rainier Blue | black, 4.9 to 1 |
| 13 | `#4b8184` | `oklch(56.72% 0.0572 200.88)` | Paradiso | black, 4.7 to 1 |
| 14 | `#417e84` | `oklch(55.42% 0.0638 204.52)` | Enamel Antique Green | white, 4.6 to 1 |
| 15 | `#357a84` | `oklch(53.95% 0.0702 207.76)` | Panorama | white, 4.9 to 1 |
| 16 | `#297583` | `oklch(52.32% 0.0757 210.96)` | Oceanic Metropolis | white, 5.2 to 1 |
| 17 | `#1d7081` | `oklch(50.54% 0.0799 214.50)` | Billabong | white, 5.6 to 1 |
| 18 | `#136a7f` | `oklch(48.62% 0.0823 218.61)` | Porpoise Place | white, 6.1 to 1 |
| 19 | `#09637b` | `oklch(46.43% 0.0836 222.73)` | Jamaican Dream | white, 6.8 to 1 |
| 20 | `#025b76` | `oklch(44.03% 0.0840 226.73)` | Prismatic Springs | white, 7.5 to 1 |
| 21 | `#005370` | `oklch(41.45% 0.0832 230.64)` | Night Kite | white, 8.4 to 1 |
| 22 | `#004a69` | `oklch(38.74% 0.0815 234.40)` | Adriatic | white, 9.5 to 1 |
| 23 | `#004262` | `oklch(35.96% 0.0798 238.03)` | Lush Aqua | white, 10.7 to 1 |
| 24 | `#003a5a` | `oklch(33.16% 0.0780 241.52)` | Gibraltar Sea | white, 12 to 1 |
| 25 | `#003152` | `oklch(30.39% 0.0763 244.88)` | Night Dive | white, 13.3 to 1 |
| 26 | `#002a4b` | `oklch(27.68% 0.0747 248.09)` | Royal Blue Metallic | white, 14.7 to 1 |
| 27 | `#002142` | `oklch(24.76% 0.0726 251.29)` | Rhapsody in Blue | white, 16.1 to 1 |
| 28 | `#001939` | `oklch(21.63% 0.0699 254.47)` | Naval Night | white, 17.5 to 1 |
| 29 | `#00112f` | `oklch(18.42% 0.0670 257.60)` | Squid’s Ink | white, 18.7 to 1 |
| 30 | `#000926` | `oklch(15.25% 0.0647 260.69)` | Mysterious Depths | white, 19.6 to 1 |
| 31 | `#00031e` | `oklch(12.24% 0.0638 263.32)` | Hadopelagic Water | white, 20.3 to 1 |
| 32 | `#000017` | `oklch(9.49% 0.0615 264.85)` | Benthic Black | white, 20.7 to 1 |
| 33 | `#00000f` | `oklch(7.62% 0.0513 267.05)` | Benthic Black | white, 20.8 to 1 |
| 34 | `#000008` | `oklch(6.15% 0.0407 268.86)` | Benthic Black | white, 20.9 to 1 |

## CSS

```css
background: conic-gradient(from 90deg, #8b715a 0.000% 2.941%, #89735a 2.941% 5.882%, #86775b 5.882% 8.824%, #817b5f 8.824% 11.765%, #7c8065 11.765% 14.706%, #76846c 14.706% 17.647%, #718673 17.647% 20.588%, #6d887a 20.588% 23.529%, #69887f 23.529% 26.471%, #638781 26.471% 29.412%, #5d8583 29.412% 32.353%, #558384 32.353% 35.294%, #4b8184 35.294% 38.235%, #417e84 38.235% 41.176%, #357a84 41.176% 44.118%, #297583 44.118% 47.059%, #1d7081 47.059% 50.000%, #136a7f 50.000% 52.941%, #09637b 52.941% 55.882%, #025b76 55.882% 58.824%, #005370 58.824% 61.765%, #004a69 61.765% 64.706%, #004262 64.706% 67.647%, #003a5a 67.647% 70.588%, #003152 70.588% 73.529%, #002a4b 73.529% 76.471%, #002142 76.471% 79.412%, #001939 79.412% 82.353%, #00112f 82.353% 85.294%, #000926 85.294% 88.235%, #00031e 88.235% 91.176%, #000017 91.176% 94.118%, #00000f 94.118% 97.059%, #000008 97.059% 100.000%);
background: conic-gradient(from 90deg, oklch(56.69% 0.0469 61.17) 0.000% 2.941%, oklch(57.01% 0.0459 70.32) 2.941% 5.882%, oklch(57.54% 0.0443 82.98) 5.882% 8.824%, oklch(58.17% 0.0423 98.13) 8.824% 11.765%, oklch(58.83% 0.0403 114.72) 11.765% 14.706%, oklch(59.42% 0.0385 131.74) 14.706% 17.647%, oklch(59.86% 0.0374 148.13) 17.647% 20.588%, oklch(60.06% 0.0371 162.88) 20.588% 23.529%, oklch(59.94% 0.0381 174.94) 23.529% 26.471%, oklch(59.46% 0.0407 183.90) 26.471% 29.412%, oklch(58.75% 0.0451 190.94) 29.412% 32.353%, oklch(57.83% 0.0508 196.48) 32.353% 35.294%, oklch(56.72% 0.0572 200.88) 35.294% 38.235%, oklch(55.42% 0.0638 204.52) 38.235% 41.176%, oklch(53.95% 0.0702 207.76) 41.176% 44.118%, oklch(52.32% 0.0757 210.96) 44.118% 47.059%, oklch(50.54% 0.0799 214.50) 47.059% 50.000%, oklch(48.62% 0.0823 218.61) 50.000% 52.941%, oklch(46.43% 0.0836 222.73) 52.941% 55.882%, oklch(44.03% 0.0840 226.73) 55.882% 58.824%, oklch(41.45% 0.0832 230.64) 58.824% 61.765%, oklch(38.74% 0.0815 234.40) 61.765% 64.706%, oklch(35.96% 0.0798 238.03) 64.706% 67.647%, oklch(33.16% 0.0780 241.52) 67.647% 70.588%, oklch(30.39% 0.0763 244.88) 70.588% 73.529%, oklch(27.68% 0.0747 248.09) 73.529% 76.471%, oklch(24.76% 0.0726 251.29) 76.471% 79.412%, oklch(21.63% 0.0699 254.47) 79.412% 82.353%, oklch(18.42% 0.0670 257.60) 82.353% 85.294%, oklch(15.25% 0.0647 260.69) 85.294% 88.235%, oklch(12.24% 0.0638 263.32) 88.235% 91.176%, oklch(9.49% 0.0615 264.85) 91.176% 94.118%, oklch(7.62% 0.0513 267.05) 94.118% 97.059%, oklch(6.15% 0.0407 268.86) 97.059% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.567 | 0.047 | 61.2 |
| 2 | 0.598 | 0.039 | 177.4 |
| 3 | 0.496 | 0.081 | 216.5 |
| 4 | 0.283 | 0.077 | 247.2 |
| 5 | 0.055 | 0.058 | 268.3 |

## In these collections

- [Navy swatches](https://grabient.com/navy-swatches)

## Other forms

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