Amz
Amz
PostsComments
KPCKevin Powell - Community
Created by Amz on 7/19/2024 in #front-end
How to use curve fitted functions to eliminate media queries
Hello! I'm trying to eliminate media queries for setting font-sizes across diff widths. So as an example I want the font-size: 12px @ 320px width, 14px @ 768px width and so on till a max of 18px @ >= 1366px width 
font-size: clamp(12px, calc(11.4691px - ( -0.001734982px / -0.001198634 ) * ( 1 - exp( 0.001198634 * 100vw ) ) ), 18px);
font-size: clamp(12px, calc(11.4691px - ( -0.001734982px / -0.001198634 ) * ( 1 - exp( 0.001198634 * 100vw ) ) ), 18px);
Problem is that exp() expects unitless values and i don't know how to do that Specifically, 100vw should return 320 or 1024 or 1920 etc without the px unit Any ideas would be greatly appreciated !
10 replies