Scale
Useful for managing percentage based sizes.
:where(html) {
--scale-1: clamp(5%, 5.5%, 6%);
--scale-2: clamp(8%, 9%, 10%);
--scale-3: clamp(11%, 12.5%, 14%);
--scale-4: clamp(14%, 16%, 18%);
--scale-5: clamp(17%, 19.5%, 22%);
--scale-6: clamp(20%, 23%, 26%);
--scale-7: clamp(23%, 26.5%, 30%);
--scale-8: clamp(26%, 30%, 34%);
--scale-9: clamp(29%, 33.5%, 38%);
--scale-10: clamp(32%, 41%, 42%);
}
--scale-1
--scale-2
--scale-3
--scale-4
--scale-5
--scale-6
--scale-7
--scale-8
--scale-9
--scale-10