I was working with a designer recently and so had to convert px measurements to REM. Given that I set the base font size to 16px, I figured the fastest way to develop some utility classes was using SASS. This script seems to generate enough utility classes and, should I need anything more for a class
or id
, I can use #{(1 / 16) * x}rem;
, where x
is the number of pixels from the designer.
@for $i from 1 through 32 { .f-s-#{$i}px { font-weight: #{(1 / 16) * $i}rem; } .l-h-#{$i}px { line-height: #{(1 / 16) * $i}rem; } }
No comments:
Post a Comment