# Seamless black and dark green angular swatches

Seamless black and dark green angular swatches with 48 colors: #21211a, #25251c, #2c2b1e, #343320, #3d3c22, #484624, #535026, #5d5a27, #686329, #706b29, #77722a, #7b762a, #7b782b, #77762d, #70722e, #676b2f, #5d6330, #52592f, #474f2e, #3d452c, #353d29, #2e3627, #2a3124, #272e23, #263022, #263523, #253d26, #23492b, #1a5633, #00653e, #00724d, #007e5c, #008a6a, #009375, #009a7c, #009c7e, #009b7a, #009670, #008e61, #00834e, #0b7736, #2a6728, #33561f, #34471a, #313a19, #2b2f19, #25261a, #21211a. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWPglMxyO_yUJQ3OxMQnwS4Q`
- Page: https://grabient.com/kWPglMxyO_yUJQ3OxMQnwS4Q?style=angularSwatches&steps=48&angle=109
- Drawn as: angular swatches, 48 steps, 109 degrees
- Kinds: vivid, seamless
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.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 | `#21211a` | `oklch(24.41% 0.0124 107.58)` | Petroleum | white, 16.2 to 1 |
| 2 | `#25251c` | `oklch(26.16% 0.0172 107.42)` | Black Chestnut Oak | white, 15.4 to 1 |
| 3 | `#2c2b1e` | `oklch(28.63% 0.0238 107.09)` | Green Waterloo | white, 14.2 to 1 |
| 4 | `#343320` | `oklch(31.64% 0.0320 106.64)` | Fuchsia Berries | white, 12.7 to 1 |
| 5 | `#3d3c22` | `oklch(35.03% 0.0412 106.13)` | Green 383 | white, 11.2 to 1 |
| 6 | `#484624` | `oklch(38.63% 0.0510 105.61)` | Nori Seaweed Green | white, 9.6 to 1 |
| 7 | `#535026` | `oklch(42.28% 0.0609 105.15)` | Warplock Bronze | white, 8.2 to 1 |
| 8 | `#5d5a27` | `oklch(45.82% 0.0705 104.80)` | Reptile Revenge | white, 7.1 to 1 |
| 9 | `#686329` | `oklch(49.07% 0.0793 104.63)` | Saguaro | white, 6.1 to 1 |
| 10 | `#706b29` | `oklch(51.87% 0.0869 104.69)` | Safari Green | white, 5.4 to 1 |
| 11 | `#77722a` | `oklch(54.06% 0.0929 105.04)` | Wood Garlic | white, 4.9 to 1 |
| 12 | `#7b762a` | `oklch(55.46% 0.0967 105.73)` | Faience Green | white, 4.7 to 1 |
| 13 | `#7b782b` | `oklch(55.92% 0.0978 106.84)` | Crocodile Eye | white, 4.6 to 1 |
| 14 | `#77762d` | `oklch(55.23% 0.0956 108.34)` | Jungle Look | white, 4.7 to 1 |
| 15 | `#70722e` | `oklch(53.54% 0.0903 110.18)` | Olivetone | white, 5 to 1 |
| 16 | `#676b2f` | `oklch(51.07% 0.0825 112.31)` | Safari Green | white, 5.6 to 1 |
| 17 | `#5d6330` | `oklch(48.03% 0.0732 114.70)` | Gardener Green | white, 6.4 to 1 |
| 18 | `#52592f` | `oklch(44.64% 0.0629 117.30)` | Soldier Green | white, 7.4 to 1 |
| 19 | `#474f2e` | `oklch(41.12% 0.0525 120.05)` | Matsuba Green | white, 8.6 to 1 |
| 20 | `#3d452c` | `oklch(37.69% 0.0427 122.93)` | Mallardish | white, 10 to 1 |
| 21 | `#353d29` | `oklch(34.56% 0.0341 125.88)` | Green Kelp | white, 11.3 to 1 |
| 22 | `#2e3627` | `oklch(31.95% 0.0275 128.85)` | Aimiru Brown | white, 12.6 to 1 |
| 23 | `#2a3124` | `oklch(30.08% 0.0237 131.81)` | Mountain Range Green | white, 13.4 to 1 |
| 24 | `#272e23` | `oklch(29.16% 0.0234 134.70)` | Pine Tree | white, 13.9 to 1 |
| 25 | `#263022` | `oklch(29.43% 0.0275 137.60)` | Mountain Range Green | white, 13.7 to 1 |
| 26 | `#263523` | `oklch(30.92% 0.0366 141.10)` | Black Leather Jacket | white, 13 to 1 |
| 27 | `#253d26` | `oklch(33.42% 0.0501 145.13)` | Mizukaze Green | white, 11.7 to 1 |
| 28 | `#23492b` | `oklch(36.69% 0.0668 149.47)` | Order Green | white, 10.2 to 1 |
| 29 | `#1a5633` | `oklch(40.49% 0.0857 153.95)` | Moor-Monster | white, 8.6 to 1 |
| 30 | `#00653e` | `oklch(44.58% 0.1037 158.33)` | Aotake Bamboo | white, 7.1 to 1 |
| 31 | `#00724d` | `oklch(48.72% 0.1061 162.48)` | Lush Meadow | white, 5.9 to 1 |
| 32 | `#007e5c` | `oklch(52.68% 0.1091 166.16)` | Spanish Viridian | white, 5 to 1 |
| 33 | `#008a6a` | `oklch(56.20% 0.1123 169.18)` | Carolina Green | black, 4.8 to 1 |
| 34 | `#009375` | `oklch(59.06% 0.1153 171.34)` | Dòu Lǜ Green | black, 5.4 to 1 |
| 35 | `#009a7c` | `oklch(61.01% 0.1178 172.44)` | Paolo Veronese Green | black, 5.8 to 1 |
| 36 | `#009c7e` | `oklch(61.82% 0.1195 172.29)` | Paolo Veronese Green | black, 6 to 1 |
| 37 | `#009b7a` | `oklch(61.31% 0.1206 170.60)` | Paolo Veronese Green | black, 5.9 to 1 |
| 38 | `#009670` | `oklch(59.67% 0.1219 167.24)` | Cadaverous | black, 5.5 to 1 |
| 39 | `#008e61` | `oklch(57.09% 0.1243 162.48)` | Chagall Green | black, 5 to 1 |
| 40 | `#00834e` | `oklch(53.76% 0.1288 156.64)` | Dark Emerald | white, 4.7 to 1 |
| 41 | `#0b7736` | `oklch(49.90% 0.1333 150.04)` | Nature’s Strength | white, 5.6 to 1 |
| 42 | `#2a6728` | `oklch(45.69% 0.1134 142.96)` | Radical Green | white, 6.8 to 1 |
| 43 | `#33561f` | `oklch(41.34% 0.0928 135.70)` | Navy Green | white, 8.4 to 1 |
| 44 | `#34471a` | `oklch(37.05% 0.0724 128.59)` | Treetop Cathedral | white, 10.1 to 1 |
| 45 | `#313a19` | `oklch(33.01% 0.0532 121.91)` | Turtle Skin | white, 12 to 1 |
| 46 | `#2b2f19` | `oklch(29.43% 0.0362 115.98)` | Metal Construction Green | white, 13.8 to 1 |
| 47 | `#25261a` | `oklch(26.49% 0.0223 111.10)` | Underworld | white, 15.2 to 1 |
| 48 | `#21211a` | `oklch(24.41% 0.0124 107.58)` | Petroleum | white, 16.2 to 1 |

## CSS

```css
background: conic-gradient(from 109deg, #21211a 0.000% 2.083%, #25251c 2.083% 4.167%, #2c2b1e 4.167% 6.250%, #343320 6.250% 8.333%, #3d3c22 8.333% 10.417%, #484624 10.417% 12.500%, #535026 12.500% 14.583%, #5d5a27 14.583% 16.667%, #686329 16.667% 18.750%, #706b29 18.750% 20.833%, #77722a 20.833% 22.917%, #7b762a 22.917% 25.000%, #7b782b 25.000% 27.083%, #77762d 27.083% 29.167%, #70722e 29.167% 31.250%, #676b2f 31.250% 33.333%, #5d6330 33.333% 35.417%, #52592f 35.417% 37.500%, #474f2e 37.500% 39.583%, #3d452c 39.583% 41.667%, #353d29 41.667% 43.750%, #2e3627 43.750% 45.833%, #2a3124 45.833% 47.917%, #272e23 47.917% 50.000%, #263022 50.000% 52.083%, #263523 52.083% 54.167%, #253d26 54.167% 56.250%, #23492b 56.250% 58.333%, #1a5633 58.333% 60.417%, #00653e 60.417% 62.500%, #00724d 62.500% 64.583%, #007e5c 64.583% 66.667%, #008a6a 66.667% 68.750%, #009375 68.750% 70.833%, #009a7c 70.833% 72.917%, #009c7e 72.917% 75.000%, #009b7a 75.000% 77.083%, #009670 77.083% 79.167%, #008e61 79.167% 81.250%, #00834e 81.250% 83.333%, #0b7736 83.333% 85.417%, #2a6728 85.417% 87.500%, #33561f 87.500% 89.583%, #34471a 89.583% 91.667%, #313a19 91.667% 93.750%, #2b2f19 93.750% 95.833%, #25261a 95.833% 97.917%, #21211a 97.917% 100.000%);
background: conic-gradient(from 109deg, oklch(24.41% 0.0124 107.58) 0.000% 2.083%, oklch(26.16% 0.0172 107.42) 2.083% 4.167%, oklch(28.63% 0.0238 107.09) 4.167% 6.250%, oklch(31.64% 0.0320 106.64) 6.250% 8.333%, oklch(35.03% 0.0412 106.13) 8.333% 10.417%, oklch(38.63% 0.0510 105.61) 10.417% 12.500%, oklch(42.28% 0.0609 105.15) 12.500% 14.583%, oklch(45.82% 0.0705 104.80) 14.583% 16.667%, oklch(49.07% 0.0793 104.63) 16.667% 18.750%, oklch(51.87% 0.0869 104.69) 18.750% 20.833%, oklch(54.06% 0.0929 105.04) 20.833% 22.917%, oklch(55.46% 0.0967 105.73) 22.917% 25.000%, oklch(55.92% 0.0978 106.84) 25.000% 27.083%, oklch(55.23% 0.0956 108.34) 27.083% 29.167%, oklch(53.54% 0.0903 110.18) 29.167% 31.250%, oklch(51.07% 0.0825 112.31) 31.250% 33.333%, oklch(48.03% 0.0732 114.70) 33.333% 35.417%, oklch(44.64% 0.0629 117.30) 35.417% 37.500%, oklch(41.12% 0.0525 120.05) 37.500% 39.583%, oklch(37.69% 0.0427 122.93) 39.583% 41.667%, oklch(34.56% 0.0341 125.88) 41.667% 43.750%, oklch(31.95% 0.0275 128.85) 43.750% 45.833%, oklch(30.08% 0.0237 131.81) 45.833% 47.917%, oklch(29.16% 0.0234 134.70) 47.917% 50.000%, oklch(29.43% 0.0275 137.60) 50.000% 52.083%, oklch(30.92% 0.0366 141.10) 52.083% 54.167%, oklch(33.42% 0.0501 145.13) 54.167% 56.250%, oklch(36.69% 0.0668 149.47) 56.250% 58.333%, oklch(40.49% 0.0857 153.95) 58.333% 60.417%, oklch(44.58% 0.1037 158.33) 60.417% 62.500%, oklch(48.72% 0.1061 162.48) 62.500% 64.583%, oklch(52.68% 0.1091 166.16) 64.583% 66.667%, oklch(56.20% 0.1123 169.18) 66.667% 68.750%, oklch(59.06% 0.1153 171.34) 68.750% 70.833%, oklch(61.01% 0.1178 172.44) 70.833% 72.917%, oklch(61.82% 0.1195 172.29) 72.917% 75.000%, oklch(61.31% 0.1206 170.60) 75.000% 77.083%, oklch(59.67% 0.1219 167.24) 77.083% 79.167%, oklch(57.09% 0.1243 162.48) 79.167% 81.250%, oklch(53.76% 0.1288 156.64) 81.250% 83.333%, oklch(49.90% 0.1333 150.04) 83.333% 85.417%, oklch(45.69% 0.1134 142.96) 85.417% 87.500%, oklch(41.34% 0.0928 135.70) 87.500% 89.583%, oklch(37.05% 0.0724 128.59) 89.583% 91.667%, oklch(33.01% 0.0532 121.91) 91.667% 93.750%, oklch(29.43% 0.0362 115.98) 93.750% 95.833%, oklch(26.49% 0.0223 111.10) 95.833% 97.917%, oklch(24.41% 0.0124 107.58) 97.917% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.244 | 0.012 | 107.6 |
| 2 | 0.559 | 0.098 | 106.5 |
| 3 | 0.291 | 0.025 | 136.1 |
| 4 | 0.618 | 0.189 | 172 |
| 5 | 0.244 | 0.012 | 107.6 |

## Other forms

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