Edward Matthews
LightNews LightNews
edwardmatthe.ws
Edward Matthews
@edwardmatthe.ws
39 followers 63 following 20 posts
Full Stack Developer.
Posts Replies Media Videos
edwardmatthe.ws
.car {
display: flex;
gap: 0px !important;
}
January 13, 2025 at 4:29 PM
edwardmatthe.ws
I've been doing responsive text wrong.

With this snippet, I can just set min/max font sizes & the scaling range through custom properties, and let CSS do the rest.
.responsive-text { --unit: 1rem; --_begin: var(--min-screen-size, 20); --_end: var(--max-screen-size, 80); --_min: var(--min-font-size, 1); --_max: var(--max-font-size, 3); --_slope: calc((var(--_max) - var(--_min)) / (var(--_end) - var(--_begin))); --_intercept: calc(var(--_min) - var(--_slope) * var(--_begin)); font-size: clamp( calc(var(--_min) * var(--unit)), calc((var(--_slope) * 100vw) + (var(--_intercept) * var(--unit))), calc(var(--_max) * var(--unit)) ); }
January 10, 2025 at 6:40 PM