# Cool green, teal and blue linear swatches

Cool green, teal and blue linear swatches with 32 colors: #0f6745, #106d4a, #127652, #14805b, #168a64, #1a936d, #1d9d76, #21a77f, #28b089, #32b993, #43c19e, #56c9a9, #66cfb3, #6fd2bc, #6ed2c1, #68cec3, #5fc7c4, #54bfc4, #4ab7c4, #3faec5, #35a5c5, #2e9ac4, #2b90c1, #2985bd, #277ab8, #2670b1, #2666a9, #285ca1, #2a5397, #2b4a8c, #2b4382, #2a3e7b. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kcdEZyySnAdkuQHlpED3KRDE4qw6-LcIsKdBY`
- Page: https://grabient.com/kcdEZyySnAdkuQHlpED3KRDE4qw6-LcIsKdBY?style=linearSwatches&steps=32
- Drawn as: linear swatches, 32 steps, 90 degrees
- Kinds: light center, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#0f6745` | `oklch(45.67% 0.0965 161.02)` | Jewel | white, 6.8 to 1 |
| 2 | `#106d4a` | `oklch(47.52% 0.0994 161.68)` | Into the Green | white, 6.3 to 1 |
| 3 | `#127652` | `oklch(50.16% 0.1036 162.64)` | Greasy Greens | white, 5.6 to 1 |
| 4 | `#14805b` | `oklch(53.20% 0.1084 163.73)` | Spanish Viridian | white, 4.9 to 1 |
| 5 | `#168a64` | `oklch(56.26% 0.1128 164.82)` | Kabalite Green | black, 4.8 to 1 |
| 6 | `#1a936d` | `oklch(59.09% 0.1165 165.76)` | Viridian | black, 5.4 to 1 |
| 7 | `#1d9d76` | `oklch(62.00% 0.1208 166.57)` | Holly Green | black, 6.1 to 1 |
| 8 | `#21a77f` | `oklch(64.95% 0.1247 167.40)` | Active Green | black, 6.8 to 1 |
| 9 | `#28b089` | `oklch(67.80% 0.1270 168.39)` | Jess | black, 7.6 to 1 |
| 10 | `#32b993` | `oklch(70.45% 0.1265 169.67)` | Mountain Meadow | black, 8.4 to 1 |
| 11 | `#43c19e` | `oklch(73.23% 0.1218 170.91)` | New Meadow | black, 9.3 to 1 |
| 12 | `#56c9a9` | `oklch(76.04% 0.1143 172.20)` | Mermaid’s Kiss | black, 10.3 to 1 |
| 13 | `#66cfb3` | `oklch(78.38% 0.1064 174.03)` | Sweet Garden | black, 11.1 to 1 |
| 14 | `#6fd2bc` | `oklch(79.77% 0.1003 176.86)` | Downy | black, 11.6 to 1 |
| 15 | `#6ed2c1` | `oklch(79.79% 0.0975 181.11)` | Downy | black, 11.6 to 1 |
| 16 | `#68cec3` | `oklch(78.61% 0.0964 186.60)` | Dip in the Pool | black, 11.1 to 1 |
| 17 | `#5fc7c4` | `oklch(76.67% 0.0966 192.91)` | Chinese Lacquer | black, 10.4 to 1 |
| 18 | `#54bfc4` | `oklch(74.41% 0.0979 199.59)` | Gem Turquoise | black, 9.6 to 1 |
| 19 | `#4ab7c4` | `oklch(72.22% 0.0999 206.26)` | Cave Lake | black, 8.8 to 1 |
| 20 | `#3faec5` | `oklch(69.87% 0.1034 213.54)` | River Blue | black, 8.1 to 1 |
| 21 | `#35a5c5` | `oklch(67.28% 0.1080 221.20)` | Laguna | black, 7.3 to 1 |
| 22 | `#2e9ac4` | `oklch(64.55% 0.1127 228.63)` | Stratos Blue | black, 6.5 to 1 |
| 23 | `#2b90c1` | `oklch(61.81% 0.1167 235.21)` | Porpita Porpita | black, 5.8 to 1 |
| 24 | `#2985bd` | `oklch(59.02% 0.1197 240.62)` | Pat-A-Pep | black, 5.1 to 1 |
| 25 | `#277ab8` | `oklch(56.12% 0.1226 245.24)` | Haddock’s Sweater | white, 4.5 to 1 |
| 26 | `#2670b1` | `oklch(53.19% 0.1248 249.30)` | Planetarium | white, 5.2 to 1 |
| 27 | `#2666a9` | `oklch(50.36% 0.1257 253.01)` | Barbados Blue | white, 5.9 to 1 |
| 28 | `#285ca1` | `oklch(47.67% 0.1246 256.60)` | Miracle at Wrigley | white, 6.6 to 1 |
| 29 | `#2a5397` | `oklch(44.87% 0.1209 260.07)` | Insignia | white, 7.5 to 1 |
| 30 | `#2b4a8c` | `oklch(42.16% 0.1158 263.24)` | Blue Highlight | white, 8.5 to 1 |
| 31 | `#2b4382` | `oklch(39.83% 0.1108 265.87)` | Official Violet | white, 9.4 to 1 |
| 32 | `#2a3e7b` | `oklch(38.19% 0.1075 267.75)` | Mazarine Blue | white, 10.1 to 1 |

## CSS

```css
background: linear-gradient(90deg, #0f6745 0.000% 3.125%, #106d4a 3.125% 6.250%, #127652 6.250% 9.375%, #14805b 9.375% 12.500%, #168a64 12.500% 15.625%, #1a936d 15.625% 18.750%, #1d9d76 18.750% 21.875%, #21a77f 21.875% 25.000%, #28b089 25.000% 28.125%, #32b993 28.125% 31.250%, #43c19e 31.250% 34.375%, #56c9a9 34.375% 37.500%, #66cfb3 37.500% 40.625%, #6fd2bc 40.625% 43.750%, #6ed2c1 43.750% 46.875%, #68cec3 46.875% 50.000%, #5fc7c4 50.000% 53.125%, #54bfc4 53.125% 56.250%, #4ab7c4 56.250% 59.375%, #3faec5 59.375% 62.500%, #35a5c5 62.500% 65.625%, #2e9ac4 65.625% 68.750%, #2b90c1 68.750% 71.875%, #2985bd 71.875% 75.000%, #277ab8 75.000% 78.125%, #2670b1 78.125% 81.250%, #2666a9 81.250% 84.375%, #285ca1 84.375% 87.500%, #2a5397 87.500% 90.625%, #2b4a8c 90.625% 93.750%, #2b4382 93.750% 96.875%, #2a3e7b 96.875% 100.000%);
background: linear-gradient(90deg, oklch(45.67% 0.0965 161.02) 0.000% 3.125%, oklch(47.52% 0.0994 161.68) 3.125% 6.250%, oklch(50.16% 0.1036 162.64) 6.250% 9.375%, oklch(53.20% 0.1084 163.73) 9.375% 12.500%, oklch(56.26% 0.1128 164.82) 12.500% 15.625%, oklch(59.09% 0.1165 165.76) 15.625% 18.750%, oklch(62.00% 0.1208 166.57) 18.750% 21.875%, oklch(64.95% 0.1247 167.40) 21.875% 25.000%, oklch(67.80% 0.1270 168.39) 25.000% 28.125%, oklch(70.45% 0.1265 169.67) 28.125% 31.250%, oklch(73.23% 0.1218 170.91) 31.250% 34.375%, oklch(76.04% 0.1143 172.20) 34.375% 37.500%, oklch(78.38% 0.1064 174.03) 37.500% 40.625%, oklch(79.77% 0.1003 176.86) 40.625% 43.750%, oklch(79.79% 0.0975 181.11) 43.750% 46.875%, oklch(78.61% 0.0964 186.60) 46.875% 50.000%, oklch(76.67% 0.0966 192.91) 50.000% 53.125%, oklch(74.41% 0.0979 199.59) 53.125% 56.250%, oklch(72.22% 0.0999 206.26) 56.250% 59.375%, oklch(69.87% 0.1034 213.54) 59.375% 62.500%, oklch(67.28% 0.1080 221.20) 62.500% 65.625%, oklch(64.55% 0.1127 228.63) 65.625% 68.750%, oklch(61.81% 0.1167 235.21) 68.750% 71.875%, oklch(59.02% 0.1197 240.62) 71.875% 75.000%, oklch(56.12% 0.1226 245.24) 75.000% 78.125%, oklch(53.19% 0.1248 249.30) 78.125% 81.250%, oklch(50.36% 0.1257 253.01) 81.250% 84.375%, oklch(47.67% 0.1246 256.60) 84.375% 87.500%, oklch(44.87% 0.1209 260.07) 87.500% 90.625%, oklch(42.16% 0.1158 263.24) 90.625% 93.750%, oklch(39.83% 0.1108 265.87) 93.750% 96.875%, oklch(38.19% 0.1075 267.75) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.457 | 0.096 | 161 |
| 2 | 0.575 | 0.114 | 165.2 |
| 3 | 0.701 | 0.127 | 169.5 |
| 4 | 0.799 | 0.099 | 177.9 |
| 5 | 0.728 | 0.099 | 204.3 |
| 6 | 0.614 | 0.117 | 236 |
| 7 | 0.488 | 0.125 | 255.1 |
| 8 | 0.382 | 0.107 | 267.7 |

## In these collections

- [Ocean gradients](https://grabient.com/ocean-gradients)
- [Navy and teal gradients](https://grabient.com/navy-and-teal-gradients)
- [Blue and green gradients](https://grabient.com/blue-and-green-gradients)

## Other forms

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