# Deep teal to mustard gradient Tritone teal, green and tan linear gradient with 32 colors: #00343e, #003640, #003a42, #003e45, #004248, #00474b, #004c4d, #00504f, #005550, #005951, #005d51, #01624f, #13654e, #20694c, #2b6c4a, #357048, #3f7346, #487744, #527b42, #5b7e40, #65823e, #6e853b, #788939, #828c38, #8b9037, #959436, #9f9836, #a99c36, #b39f37, #bca338, #c3a53a, #c9a73b. Edit it and copy or download CSS, SVG, PNG or shader code. - Also called: Tritone teal, green and tan linear gradient - Seed: `kWTCyZMx087-guzOqDvXi89I` - Page: https://grabient.com/kWTCyZMx087-guzOqDvXi89I?steps=32 - Drawn as: linear gradient, 32 steps, 90 degrees - Kinds: dark to light, vivid, multicolor - Hues: wide - Contrast of its darkest and lightest colors: 5.8 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 | `#00343e` | `oklch(29.93% 0.0529 215.23)` | Artist Blue | white, 13.4 to 1 | | 2 | `#003640` | `oklch(30.75% 0.0539 213.30)` | Natural Indigo | white, 13 to 1 | | 3 | `#003a42` | `oklch(31.85% 0.0553 210.83)` | Natural Indigo | white, 12.5 to 1 | | 4 | `#003e45` | `oklch(33.17% 0.0570 207.90)` | Ghostlands Coal | white, 11.8 to 1 | | 5 | `#004248` | `oklch(34.62% 0.0591 204.58)` | Warm Black | white, 11.1 to 1 | | 6 | `#00474b` | `oklch(36.15% 0.0615 200.93)` | Incubi Darkness | white, 10.5 to 1 | | 7 | `#004c4d` | `oklch(37.68% 0.0641 197.03)` | Dark Teal | white, 9.8 to 1 | | 8 | `#00504f` | `oklch(39.14% 0.0671 192.94)` | Wool Turquoise | white, 9.2 to 1 | | 9 | `#005550` | `oklch(40.49% 0.0702 188.71)` | Cape Verde | white, 8.7 to 1 | | 10 | `#005951` | `oklch(41.75% 0.0739 184.09)` | Baltic Prince | white, 8.2 to 1 | | 11 | `#005d51` | `oklch(42.99% 0.0785 179.04)` | Alpine Green | white, 7.7 to 1 | | 12 | `#01624f` | `oklch(44.21% 0.0841 173.73)` | Sci-Fi Takeout | white, 7.3 to 1 | | 13 | `#13654e` | `oklch(45.44% 0.0850 168.24)` | Green Paw Paw | white, 6.9 to 1 | | 14 | `#20694c` | `oklch(46.69% 0.0860 162.72)` | Pumpkin Green | white, 6.6 to 1 | | 15 | `#2b6c4a` | `oklch(47.98% 0.0872 157.30)` | Chopped Chive | white, 6.2 to 1 | | 16 | `#357048` | `oklch(49.31% 0.0887 152.11)` | Parsley Sprig | white, 5.9 to 1 | | 17 | `#3f7346` | `oklch(50.71% 0.0906 147.22)` | Grasslands | white, 5.5 to 1 | | 18 | `#487744` | `oklch(52.16% 0.0929 142.38)` | Autumn Crocodile | white, 5.2 to 1 | | 19 | `#527b42` | `oklch(53.65% 0.0955 137.59)` | Mana Tree | white, 4.9 to 1 | | 20 | `#5b7e40` | `oklch(55.18% 0.0982 132.88)` | Mangrove Leaf | white, 4.6 to 1 | | 21 | `#65823e` | `oklch(56.73% 0.1011 128.30)` | Swamp Moss | black, 4.8 to 1 | | 22 | `#6e853b` | `oklch(58.29% 0.1040 123.88)` | Khaki Green | black, 5.1 to 1 | | 23 | `#788939` | `oklch(59.86% 0.1069 119.67)` | Pesto di Rucola | black, 5.4 to 1 | | 24 | `#828c38` | `oklch(61.42% 0.1096 115.71)` | Absinthe Dreams | black, 5.7 to 1 | | 25 | `#8b9037` | `oklch(63.03% 0.1122 111.96)` | Wasabi Nuts | black, 6.1 to 1 | | 26 | `#959436` | `oklch(64.78% 0.1151 108.27)` | Plantain | black, 6.5 to 1 | | 27 | `#9f9836` | `oklch(66.61% 0.1180 104.71)` | Be Yourself | black, 6.9 to 1 | | 28 | `#a99c36` | `oklch(68.43% 0.1208 101.36)` | Pestulance | black, 7.4 to 1 | | 29 | `#b39f37` | `oklch(70.16% 0.1235 98.29)` | Martian | black, 7.9 to 1 | | 30 | `#bca338` | `oklch(71.72% 0.1260 95.58)` | Grassy Ochre | black, 8.4 to 1 | | 31 | `#c3a53a` | `oklch(73.04% 0.1280 93.29)` | Deadsy | black, 8.7 to 1 | | 32 | `#c9a73b` | `oklch(74.02% 0.1295 91.52)` | Aru Ressha | black, 9 to 1 | ## CSS ```css background: linear-gradient(90deg, #00343e 0.0%, #003640 3.2%, #003a42 6.5%, #003e45 9.7%, #004248 12.9%, #00474b 16.1%, #004c4d 19.4%, #00504f 22.6%, #005550 25.8%, #005951 29.0%, #005d51 32.3%, #01624f 35.5%, #13654e 38.7%, #20694c 41.9%, #2b6c4a 45.2%, #357048 48.4%, #3f7346 51.6%, #487744 54.8%, #527b42 58.1%, #5b7e40 61.3%, #65823e 64.5%, #6e853b 67.7%, #788939 71.0%, #828c38 74.2%, #8b9037 77.4%, #959436 80.6%, #9f9836 83.9%, #a99c36 87.1%, #b39f37 90.3%, #bca338 93.5%, #c3a53a 96.8%, #c9a73b 100.0%); background: linear-gradient(90deg in oklch, oklch(29.93% 0.0529 215.23) 0.0%, oklch(30.75% 0.0539 213.30) 3.2%, oklch(31.85% 0.0553 210.83) 6.5%, oklch(33.17% 0.0570 207.90) 9.7%, oklch(34.62% 0.0591 204.58) 12.9%, oklch(36.15% 0.0615 200.93) 16.1%, oklch(37.68% 0.0641 197.03) 19.4%, oklch(39.14% 0.0671 192.94) 22.6%, oklch(40.49% 0.0702 188.71) 25.8%, oklch(41.75% 0.0739 184.09) 29.0%, oklch(42.99% 0.0785 179.04) 32.3%, oklch(44.21% 0.0841 173.73) 35.5%, oklch(45.44% 0.0850 168.24) 38.7%, oklch(46.69% 0.0860 162.72) 41.9%, oklch(47.98% 0.0872 157.30) 45.2%, oklch(49.31% 0.0887 152.11) 48.4%, oklch(50.71% 0.0906 147.22) 51.6%, oklch(52.16% 0.0929 142.38) 54.8%, oklch(53.65% 0.0955 137.59) 58.1%, oklch(55.18% 0.0982 132.88) 61.3%, oklch(56.73% 0.1011 128.30) 64.5%, oklch(58.29% 0.1040 123.88) 67.7%, oklch(59.86% 0.1069 119.67) 71.0%, oklch(61.42% 0.1096 115.71) 74.2%, oklch(63.03% 0.1122 111.96) 77.4%, oklch(64.78% 0.1151 108.27) 80.6%, oklch(66.61% 0.1180 104.71) 83.9%, oklch(68.43% 0.1208 101.36) 87.1%, oklch(70.16% 0.1235 98.29) 90.3%, oklch(71.72% 0.1260 95.58) 93.5%, oklch(73.04% 0.1280 93.29) 96.8%, oklch(74.02% 0.1295 91.52) 100.0%); ``` ## Keyframes 5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.299 | 0.061 | 215.2 | | 2 | 0.402 | 0.08 | 189.8 | | 3 | 0.5 | 0.09 | 149.6 | | 4 | 0.618 | 0.11 | 114.8 | | 5 | 0.74 | 0.13 | 91.5 | ## In these collections - [Dark autumn color palette](https://grabient.com/dark-autumn-color-palette) ## Other forms - [JSON](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.json?steps=32) - [PNG](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.png?steps=32) - [SVG](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.svg?steps=32) - [CSS](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.css?steps=32) - [ASE](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.ase?steps=32) - [GPL](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.gpl?steps=32) - [GRD](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.grd?steps=32) - [Design tokens](https://grabient.com/kWTCyZMx087-guzOqDvXi89I.tokens.json?steps=32) - [Social card](https://grabient.com/api/og?seed=kWTCyZMx087-guzOqDvXi89I&steps=32) - [Palettes like this one](https://grabient.com/palettes?q=kWTCyZMx087-guzOqDvXi89I) - [Guide for agents](https://grabient.com/llms.txt)