open-props/src/props.colors-hsl.css

<div align="center">

:where(html) {
  --gray-0-hsl: 210 17% 98%;
  --gray-1-hsl: 210 17% 95%;
  --gray-2-hsl: 210 16% 93%;
  --gray-3-hsl: 210 14% 89%;
  --gray-4-hsl: 210 14% 83%;
  --gray-5-hsl: 210 11% 71%;
  --gray-6-hsl: 210 7% 56%;
  --gray-7-hsl: 210 9% 31%;
  --gray-8-hsl: 210 10% 23%;
  --gray-9-hsl: 210 11% 15%;
  --red-0-hsl: 0 100% 98%;
  --red-1-hsl: 0 100% 95%;
  --red-2-hsl: 0 100% 89%;
  --red-3-hsl: 0 100% 83%;
  --red-4-hsl: 0 100% 76%;
  --red-5-hsl: 0 100% 71%;
  --red-6-hsl: 0 94% 65%;
  --red-7-hsl: 0 86% 59%;
  --red-8-hsl: 0 74% 54%;
  --red-9-hsl: 0 65% 48%;
  --pink-0-hsl: 336 100% 97%;
  --pink-1-hsl: 336 100% 94%;
  --pink-2-hsl: 338 91% 87%;
  --pink-3-hsl: 339 90% 81%;
  --pink-4-hsl: 339 88% 74%;
  --pink-5-hsl: 339 82% 67%;
  --pink-6-hsl: 339 76% 59%;
  --pink-7-hsl: 339 67% 52%;
  --pink-8-hsl: 339 68% 45%;
  --pink-9-hsl: 339 69% 38%;
  --grape-0-hsl: 280 67% 96%;
  --grape-1-hsl: 287 77% 92%;
  --grape-2-hsl: 288 86% 86%;
  --grape-3-hsl: 289 85% 78%;
  --grape-4-hsl: 288 83% 71%;
  --grape-5-hsl: 288 75% 64%;
  --grape-6-hsl: 288 67% 58%;
  --grape-7-hsl: 288 56% 52%;
  --grape-8-hsl: 288 54% 46%;
  --grape-9-hsl: 288 54% 40%;
  --violet-0-hsl: 252 100% 97%;
  --violet-1-hsl: 257 100% 93%;
  --violet-2-hsl: 256 100% 87%;
  --violet-3-hsl: 255 94% 79%;
  --violet-4-hsl: 255 93% 72%;
  --violet-5-hsl: 255 91% 67%;
  --violet-6-hsl: 255 86% 63%;
  --violet-7-hsl: 255 78% 60%;
  --violet-8-hsl: 255 67% 55%;
  --violet-9-hsl: 255 53% 50%;
  --indigo-0-hsl: 223 100% 96%;
  --indigo-1-hsl: 225 100% 93%;
  --indigo-2-hsl: 228 100% 86%;
  --indigo-3-hsl: 228 100% 78%;
  --indigo-4-hsl: 228 96% 72%;
  --indigo-5-hsl: 228 94% 67%;
  --indigo-6-hsl: 228 89% 63%;
  --indigo-7-hsl: 228 81% 59%;
  --indigo-8-hsl: 228 69% 55%;
  --indigo-9-hsl: 230 57% 50%;
  --blue-0-hsl: 205 100% 95%;
  --blue-1-hsl: 206 100% 91%;
  --blue-2-hsl: 206 100% 82%;
  --blue-3-hsl: 206 96% 72%;
  --blue-4-hsl: 207 91% 64%;
  --blue-5-hsl: 207 86% 57%;
  --blue-6-hsl: 208 80% 52%;
  --blue-7-hsl: 208 77% 47%;
  --blue-8-hsl: 209 77% 43%;
  --blue-9-hsl: 209 75% 38%;
  --cyan-0-hsl: 185 81% 94%;
  --cyan-1-hsl: 185 84% 88%;
  --cyan-2-hsl: 186 77% 77%;
  --cyan-3-hsl: 187 74% 65%;
  --cyan-4-hsl: 187 69% 55%;
  --cyan-5-hsl: 188 72% 47%;
  --cyan-6-hsl: 187 80% 42%;
  --cyan-7-hsl: 188 83% 37%;
  --cyan-8-hsl: 189 85% 32%;
  --cyan-9-hsl: 189 85% 28%;
  --teal-0-hsl: 161 79% 95%;
  --teal-1-hsl: 160 85% 87%;
  --teal-2-hsl: 162 78% 77%;
  --teal-3-hsl: 162 72% 65%;
  --teal-4-hsl: 162 68% 54%;
  --teal-5-hsl: 162 73% 46%;
  --teal-6-hsl: 162 82% 40%;
  --teal-7-hsl: 162 87% 35%;
  --teal-8-hsl: 162 88% 30%;
  --teal-9-hsl: 162 88% 26%;
  --green-0-hsl: 131 67% 95%;
  --green-1-hsl: 128 76% 90%;
  --green-2-hsl: 128 71% 82%;
  --green-3-hsl: 129 68% 73%;
  --green-4-hsl: 130 61% 64%;
  --green-5-hsl: 130 57% 56%;
  --green-6-hsl: 131 50% 50%;
  --green-7-hsl: 131 53% 46%;
  --green-8-hsl: 131 54% 40%;
  --green-9-hsl: 132 52% 35%;
  --lime-0-hsl: 79 81% 94%;
  --lime-1-hsl: 80 83% 88%;
  --lime-2-hsl: 81 81% 80%;
  --lime-3-hsl: 82 75% 69%;
  --lime-4-hsl: 83 73% 59%;
  --lime-5-hsl: 84 69% 51%;
  --lime-6-hsl: 85 74% 45%;
  --lime-7-hsl: 85 79% 40%;
  --lime-8-hsl: 86 84% 36%;
  --lime-9-hsl: 85 84% 32%;
  --yellow-0-hsl: 50 100% 93%;
  --yellow-1-hsl: 49 100% 87%;
  --yellow-2-hsl: 49 100% 80%;
  --yellow-3-hsl: 48 100% 70%;
  --yellow-4-hsl: 47 100% 62%;
  --yellow-5-hsl: 45 97% 54%;
  --yellow-6-hsl: 42 96% 50%;
  --yellow-7-hsl: 39 100% 48%;
  --yellow-8-hsl: 35 100% 47%;
  --yellow-9-hsl: 31 100% 45%;
  --orange-0-hsl: 34 100% 95%;
  --orange-1-hsl: 33 100% 90%;
  --orange-2-hsl: 33 100% 83%;
  --orange-3-hsl: 32 100% 74%;
  --orange-4-hsl: 31 100% 65%;
  --orange-5-hsl: 29 100% 58%;
  --orange-6-hsl: 27 98% 54%;
  --orange-7-hsl: 24 94% 50%;
  --orange-8-hsl: 21 90% 48%;
  --orange-9-hsl: 17 87% 45%;
}