As the Typography section states, Luxa CSS builds on a fluid scaling system that dynamically adjusts sizes according to the viewport width.

This fluidity comes from a simple formula in the CSS’s clamp function , ensuring that everything is perfectly balanced, regardless of the screen size.

NameMin size (px)Calc (px + vw)Max size (px)
--lx-space-011211.33px + 0.2083vw14
--lx-space-021817px + 0.3125vw21
--lx-space-032422.67px + 0.4167vw28
--lx-space-043634px + 0.625vw42
--lx-space-054845.33px + 0.8333vw56
--lx-space-067268px + 1.25vw84