# Teal and near-black plum noir palette The Teal and near-black plum noir palette brings together teal, blue, purple, magenta, and dark magenta. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark magenta, and its lightest tone is teal. - Also called: Teal, blue, purple and black linear gradient - Seed: `kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA` - Page: https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA?steps=32&angle=135 - Drawn as: linear gradient, 32 steps, 135 degrees - Kinds: light to dark, dark - Hues: two-hue - Contrast of its darkest and lightest colors: 7.3 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 | `#47b2a2` | `oklch(69.69% 0.1006 182.11)` | Sacred Turquoise | black, 8.1 to 1 | | 2 | `#43a8a1` | `oklch(67.15% 0.0939 188.91)` | Bahaman Bliss | black, 7.3 to 1 | | 3 | `#429a9d` | `oklch(63.51% 0.0840 198.43)` | Aquatic Green | black, 6.3 to 1 | | 4 | `#438a96` | `oklch(59.33% 0.0730 209.64)` | Seachange | black, 5.3 to 1 | | 5 | `#457b8d` | `oklch(55.19% 0.0633 221.54)` | Jelly Bean | white, 4.7 to 1 | | 6 | `#456e84` | `oklch(51.67% 0.0570 233.12)` | Blue Loneliness | white, 5.5 to 1 | | 7 | `#45647e` | `oklch(48.96% 0.0556 244.50)` | Stellar | white, 6.2 to 1 | | 8 | `#455b7a` | `oklch(46.59% 0.0574 256.85)` | Newburyport | white, 6.9 to 1 | | 9 | `#465276` | `oklch(44.51% 0.0614 269.34)` | Astronaut | white, 7.6 to 1 | | 10 | `#484a72` | `oklch(42.68% 0.0662 281.10)` | Purple Berry | white, 8.3 to 1 | | 11 | `#4b436e` | `oklch(41.05% 0.0705 291.25)` | Izmir Purple | white, 9 to 1 | | 12 | `#4c3d69` | `oklch(39.65% 0.0739 299.18)` | Geode | white, 9.6 to 1 | | 13 | `#4e3865` | `oklch(38.59% 0.0779 305.41)` | Petunia | white, 10 to 1 | | 14 | `#4f3462` | `oklch(37.76% 0.0819 310.35)` | Royal Crown | white, 10.4 to 1 | | 15 | `#50305f` | `oklch(37.02% 0.0854 314.37)` | Royal Crown | white, 10.8 to 1 | | 16 | `#502d5b` | `oklch(36.26% 0.0877 317.84)` | Grape Royale | white, 11.2 to 1 | | 17 | `#502a57` | `oklch(35.38% 0.0882 321.00)` | Kuwanomi Purple | white, 11.6 to 1 | | 18 | `#4e2753` | `oklch(34.50% 0.0872 323.40)` | Deep Plum | white, 12 to 1 | | 19 | `#4c254f` | `oklch(33.64% 0.0850 325.11)` | Murasaki | white, 12.4 to 1 | | 20 | `#4a244b` | `oklch(32.74% 0.0821 326.36)` | Murasaki | white, 12.8 to 1 | | 21 | `#472247` | `oklch(31.79% 0.0791 327.33)` | Purple Void | white, 13.2 to 1 | | 22 | `#442043` | `oklch(30.74% 0.0763 328.21)` | Purple Void | white, 13.7 to 1 | | 23 | `#401e3f` | `oklch(29.60% 0.0736 328.69)` | Purple Void | white, 14.2 to 1 | | 24 | `#3c1b3b` | `oklch(28.39% 0.0707 328.80)` | Nightly Voyager | white, 14.8 to 1 | | 25 | `#381937` | `oklch(27.13% 0.0675 328.77)` | Nightly Voyager | white, 15.4 to 1 | | 26 | `#341733` | `oklch(25.86% 0.0640 328.79)` | Nightly Voyager | white, 15.9 to 1 | | 27 | `#30152e` | `oklch(24.59% 0.0599 329.07)` | Cultist Robe | white, 16.5 to 1 | | 28 | `#2b132a` | `oklch(23.19% 0.0546 329.63)` | Dark Prom Queen | white, 17.1 to 1 | | 29 | `#261124` | `oklch(21.68% 0.0484 330.34)` | Inside | white, 17.6 to 1 | | 30 | `#210f1f` | `oklch(20.23% 0.0422 331.07)` | Inside | white, 18.2 to 1 | | 31 | `#1d0d1b` | `oklch(18.99% 0.0368 331.72)` | Shot in the Dark | white, 18.6 to 1 | | 32 | `#1a0c18` | `oklch(18.11% 0.0331 332.17)` | Shot in the Dark | white, 18.9 to 1 | ## CSS ```css background: linear-gradient(135deg, #47b2a2 0.0%, #43a8a1 3.2%, #429a9d 6.5%, #438a96 9.7%, #457b8d 12.9%, #456e84 16.1%, #45647e 19.4%, #455b7a 22.6%, #465276 25.8%, #484a72 29.0%, #4b436e 32.3%, #4c3d69 35.5%, #4e3865 38.7%, #4f3462 41.9%, #50305f 45.2%, #502d5b 48.4%, #502a57 51.6%, #4e2753 54.8%, #4c254f 58.1%, #4a244b 61.3%, #472247 64.5%, #442043 67.7%, #401e3f 71.0%, #3c1b3b 74.2%, #381937 77.4%, #341733 80.6%, #30152e 83.9%, #2b132a 87.1%, #261124 90.3%, #210f1f 93.5%, #1d0d1b 96.8%, #1a0c18 100.0%); background: linear-gradient(135deg in oklch, oklch(69.69% 0.1006 182.11) 0.0%, oklch(67.15% 0.0939 188.91) 3.2%, oklch(63.51% 0.0840 198.43) 6.5%, oklch(59.33% 0.0730 209.64) 9.7%, oklch(55.19% 0.0633 221.54) 12.9%, oklch(51.67% 0.0570 233.12) 16.1%, oklch(48.96% 0.0556 244.50) 19.4%, oklch(46.59% 0.0574 256.85) 22.6%, oklch(44.51% 0.0614 269.34) 25.8%, oklch(42.68% 0.0662 281.10) 29.0%, oklch(41.05% 0.0705 291.25) 32.3%, oklch(39.65% 0.0739 299.18) 35.5%, oklch(38.59% 0.0779 305.41) 38.7%, oklch(37.76% 0.0819 310.35) 41.9%, oklch(37.02% 0.0854 314.37) 45.2%, oklch(36.26% 0.0877 317.84) 48.4%, oklch(35.38% 0.0882 321.00) 51.6%, oklch(34.50% 0.0872 323.40) 54.8%, oklch(33.64% 0.0850 325.11) 58.1%, oklch(32.74% 0.0821 326.36) 61.3%, oklch(31.79% 0.0791 327.33) 64.5%, oklch(30.74% 0.0763 328.21) 67.7%, oklch(29.60% 0.0736 328.69) 71.0%, oklch(28.39% 0.0707 328.80) 74.2%, oklch(27.13% 0.0675 328.77) 77.4%, oklch(25.86% 0.0640 328.79) 80.6%, oklch(24.59% 0.0599 329.07) 83.9%, oklch(23.19% 0.0546 329.63) 87.1%, oklch(21.68% 0.0484 330.34) 90.3%, oklch(20.23% 0.0422 331.07) 93.5%, oklch(18.99% 0.0368 331.72) 96.8%, oklch(18.11% 0.0331 332.17) 100.0%); ``` ## Keyframes 7 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.697 | 0.101 | 182.1 | | 2 | 0.512 | 0.056 | 234.9 | | 3 | 0.406 | 0.072 | 294.1 | | 4 | 0.358 | 0.088 | 319.5 | | 5 | 0.311 | 0.077 | 327.9 | | 6 | 0.248 | 0.061 | 329 | | 7 | 0.181 | 0.033 | 332.2 | ## In these collections - [Plum noir](https://grabient.com/plum-noir) ## Other forms - [JSON](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.json?steps=32&angle=135) - [PNG](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.png?steps=32&angle=135) - [SVG](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.svg?steps=32&angle=135) - [CSS](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.css?steps=32&angle=135) - [ASE](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.ase?steps=32&angle=135) - [GPL](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.gpl?steps=32&angle=135) - [GRD](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.grd?steps=32&angle=135) - [Design tokens](https://grabient.com/kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA.tokens.json?steps=32&angle=135) - [Social card](https://grabient.com/api/og?seed=kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA&steps=32&angle=135) - [Palettes like this one](https://grabient.com/palettes?q=kasUmBwRTGLOaRutoELp5xA5-WQAXDEBA) - [Guide for agents](https://grabient.com/llms.txt)