More so than less I run into times when I need to use pt instead of px or em instead of pt, or whatever the case, and trying to find the right size for something bigger than say 36px is sometimes more of a pain in the .... than it should. So I basically want to make myself a little conversion calculator. However I can't seem to find anything that distinguishes what the conversion rate is from one to the other for an equal counter part of the other.
I am hoping I can find someone here who can help me with that. Basically my overall hope is to make myself a little jquery based input like calculator. I key in my px, pt, %, other and select my conversion to type and click ok.
Creating the calculate, easy enough. The math I would have to apply on a per conversion basis not so much, and thats what I am hoping to find here so I can do it.
Ems (em) are scalable units, used in digital media. One em corresponds to the height of the current font; for example, if the font used has a height of 12 pt, then 1 em = 12 pt. Ems are a popular unit because they are easy to understand, can be scaled if desired, and are mobile-device friendly.
How many PX is a PT? One point is the equivalent of 1.333(3) pixels. On the other hand, one pixel is the equivalent of 0.75 points.
Well,
12pt = 16px = 1em = 100%
assuming you don't change the font size on the body (else the pt will be different), the dpi of your OS is set at 72 etc etc..
The relationship looks like:
pt = 3/4*px
em = pt/12
% = pt*100/12
in this case. It's worth pointing out that using pt is wrong, unless you are printing something, and that using px, % or em is more usual.
Personally, I just use px or em. Using % or em is handy for designs where the base font size changes for smaller screens.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With