The CSS progress() function is now in all major engines! Here's how it works:
18 reposts119 likes
Great news 🤩 For anyone interested in how to use progress in fluid typography @matthewmorete.com made an excellent post about it here 👇 blog.master.dev/fluid-typogr...
Pretty much! There's also a proposal for lerp drafts.csswg.org/css-values-5...
Typed arithmetic (caniuse.com/mdn-css_type...) alternative to dev.to/janeori/css-... with progress(). 😍 As long as you choose a sufficiently large maximum: --100vw: calc(10000 * progress(100vw, 0px, 10000px)); Or with no-clamp: --100vw: progress(no-clamp 100vw, 0px, 1px);