Sage light ui palette

Pastel analogous green, blue and teal color palette

The Sage light ui palette brings together green and light green. The colors span a narrow lightness range, combining moderate color with gentle contrast. Angular gradient, 48 colors at 120°: #72a87c, #6cb084, #97d7ba, #afead4, #7dcaa4. Edit and export CSS, SVG, PNG or a shader.

4 editable OKLCH keyframes.

#72a87c
#72a87d
#71a97d
#71a97d
#70aa7e
#6faa7e
#6fab7f
#6eab7f
#6dac80
#6dad81
#6cae82
#6caf83
#6cb084
#6cb286
#6db489
#6eb68b
#70b88e
#73ba92
#77be97
#7bc19c
#80c6a2
#85caa8
#8bceae
#91d3b4
#97d7ba
#9ddcc0
#a2e0c6
#a7e3cb
#ace7cf
#b0e9d3
#b2ebd6
#b4edd8
#b4edd8
#b3edd7
#b2ecd6
#afead4
#abe8d0
#a7e6cd
#a2e3c8
#9ee0c4
#98ddbf
#93d9ba
#8fd6b6
#8ad3b1
#86d0ad
#82cea9
#7fcca6
#7dcaa4

CSS

background: conic-gradient(from 120deg in oklch, oklch(68.11% 0.0854 149.77) 0.0%, oklch(68.22% 0.0859 150.02) 2.1%, oklch(68.32% 0.0865 150.31) 4.3%, oklch(68.41% 0.0873 150.64) 6.4%, oklch(68.49% 0.0882 151.00) 8.5%, oklch(68.58% 0.0892 151.40) 10.6%, oklch(68.69% 0.0902 151.82) 12.8%, oklch(68.82% 0.0913 152.27) 14.9%, oklch(68.98% 0.0923 152.75) 17.0%, oklch(69.17% 0.0933 153.26) 19.1%, oklch(69.41% 0.0941 153.79) 21.3%, oklch(69.71% 0.0948 154.34) 23.4%, oklch(70.07% 0.0954 154.91) 25.5%, oklch(70.50% 0.0957 155.51) 27.7%, oklch(71.01% 0.0957 156.11) 29.8%, oklch(71.60% 0.0954 156.74) 31.9%, oklch(72.29% 0.0948 157.38) 34.0%, oklch(73.18% 0.0937 158.12) 36.2%, oklch(74.27% 0.0921 158.97) 38.3%, oklch(75.51% 0.0902 159.89) 40.4%, oklch(76.87% 0.0879 160.87) 42.6%, oklch(78.32% 0.0854 161.90) 44.7%, oklch(79.83% 0.0827 162.94) 46.8%, oklch(81.35% 0.0800 163.98) 48.9%, oklch(82.86% 0.0773 165.00) 51.1%, oklch(84.32% 0.0746 165.98) 53.2%, oklch(85.70% 0.0721 166.89) 55.3%, oklch(86.95% 0.0699 167.72) 57.4%, oklch(88.05% 0.0679 168.45) 59.6%, oklch(88.96% 0.0664 169.05) 61.7%, oklch(89.65% 0.0653 169.50) 63.8%, oklch(90.08% 0.0648 169.79) 66.0%, oklch(90.22% 0.0649 169.89) 68.1%, oklch(90.09% 0.0656 169.80) 70.2%, oklch(89.71% 0.0667 169.54) 72.3%, oklch(89.13% 0.0683 169.14) 74.5%, oklch(88.37% 0.0703 168.61) 76.6%, oklch(87.47% 0.0725 167.99) 78.7%, oklch(86.46% 0.0750 167.29) 80.9%, oklch(85.37% 0.0776 166.54) 83.0%, oklch(84.25% 0.0803 165.76) 85.1%, oklch(83.11% 0.0829 164.97) 87.2%, oklch(82.00% 0.0855 164.20) 89.4%, oklch(80.94% 0.0880 163.46) 91.5%, oklch(79.98% 0.0903 162.79) 93.6%, oklch(79.13% 0.0923 162.21) 95.7%, oklch(78.45% 0.0939 161.73) 97.9%, oklch(77.95% 0.0951 161.39) 100.0%);

In these collections

Light UI gradients