px ↔ rem ↔ em Converter
CSS work constantly bounces between px (Figma, design specs), rem (Tailwind defaults, accessibility-friendly), em / % (legacy templates) and pt (print stylesheets). Pick a root font-size (browsers default to 16 px), enter any one value and this tool instantly shows the equivalents in all five units along with a 10 px → 64 px reference table — handy for typography systems and accessibility audits.
Browsers default to 16 px; change this only if you override :root { font-size: ... } in CSS.
Enter a valid number
Equivalent values
Common px → rem / em / % / pt reference
Recomputed against the current root font-size; rem and em scale with it.
| px | rem | em | % | pt |
|---|---|---|---|---|
| 10 | — | — | — | — |
| 12 | — | — | — | — |
| 14 | — | — | — | — |
| 16 | — | — | — | — |
| 18 | — | — | — | — |
| 20 | — | — | — | — |
| 24 | — | — | — | — |
| 32 | — | — | — | — |
| 40 | — | — | — | — |
| 48 | — | — | — | — |
| 64 | — | — | — | — |
—
Formula
1 rem = 1 em = (root font-size) px; 100 % ≡ 1 em; 1 pt = 96/72 px = 4/3 px (CSS absolute units: 1 in = 96 px = 72 pt).
- · Browsers default the root font-size to 16 px, so 1 rem = 16 px, 12 pt = 16 px, 24 px = 1.5 rem.
- · rem follows the :root (i.e. <html>) font-size; em follows the closest parent's font-size. This tool assumes em and rem share the same base, which covers ~99 % of real-world conversions.
- · Accessibility tip: use rem (not px) for type and spacing so users can scale UI via their OS/browser zero-font-size preference, which multiplies the :root.
- · Tailwind CSS sets 1 rem = 16 px and bakes that into its spacing scale (e.g. p-4 = 1 rem = 16 px). Overriding :root font-size scales the entire system proportionally.
- · 100 % equals 1 em only in font-size contexts. For other properties (width, line-height, margin) the % reference differs — e.g. width: 50 % is half of the parent element's width, not its font-size.
- · CSS px is not a physical pixel: it is a reference pixel defined as 1/96 in, so one CSS px may span several device pixels on Retina/high-DPI displays. Source: W3C CSS Values & Units Level 4 §6.1 (absolute lengths) and §6.2 (font-relative lengths).
Frequently asked
When should I use px vs rem vs em?
Common best practice: use rem for type, spacing and container widths; use px for borders, shadows and sub-pixel details (e.g. 1 px hairlines); use em for inner padding and line-height that should scale with the element's own font-size. Bootstrap, Tailwind and Material all default to rem. The main reason is user font-scaling: a layout written entirely in px ignores the browser/OS "default font size" preference, violating WCAG SC 1.4.4 (Resize Text). For one-off marketing pages with full-page zoom only, px is fine.
Is the "html { font-size: 62.5 %; }" trick (so 1 rem = 10 px) a good idea?
It is an old trick (set :root to 62.5 % so 1 rem = 10 px and mental arithmetic is easy). Today it is largely discouraged for two reasons: (1) you override the user's configured default font-size, undermining accessibility; (2) every third-party component and design framework (Tailwind, Bootstrap, etc.) assumes :root = 16 px, so every imported library will shrink. Modern design systems handle the convenience at build time (e.g. Tailwind's text-base = 1 rem), so the trick is no longer needed.
Why does 12 pt come out to exactly 16 px? Is it the same pt as Microsoft Word / PDF?
Yes — CSS, print and PDF all use the same point definition (1 in = 72 pt). CSS additionally pins 1 in to 96 px (the reference pixel), so 1 pt = 96/72 px = 4/3 px, and 12 pt = 12 × 4/3 = 16 px. That is also why classic print typography's "12 pt body" lines up exactly with the 16 px web default — W3C chose the ratio deliberately. Adobe Reader, Microsoft Word and Apple Pages all use the same PostScript point. The legacy "printer's point" (72.27 pt/in ≈ 0.351 mm) from TeX/LaTeX is a different, older typographic unit and is not used by CSS or modern PDF.
Is the minimum accessible font size 16 px or 12 px?
WCAG 2.2 sets no hard minimum, but the practical consensus is to keep body copy at ≥ 16 px / 1 rem (mobile Safari also auto-zooms inputs smaller than 16 px, which is annoying). Material Design recommends 14 px+, Apple HIG recommends 17 pt for iOS body, and Microsoft Fluent recommends 14 px+. "Body ≥ 16 px / 12 pt / 1 rem" is a safe baseline; metadata or legal fine print should not go below 12 px / 9 pt / 0.75 rem. The key is to write the sizes in rem so users can scale them.
Related tools
Length Unit Converter
Cm, m, km, in, ft, yd, mi — common length units, converted instantly.
Temperature Converter
Convert between Celsius (°C), Fahrenheit (°F) and Kelvin (K) instantly.
Shoe Size Converter (US / UK / EU / CM)
Enter your foot length or a size in any system to see the equivalent US / UK / EU and centimetre sizes.
Paper Size Reference
Pick a paper size (A0–A10, B / C series, Letter, Legal, card sizes) to see its mm / cm / inch / pixel dimensions.
Number Base Converter (Binary / Octal / Decimal / Hex)
Convert a number simultaneously between binary, octal, decimal and hexadecimal — useful for programmers, students and electronics work.
Aspect Ratio & Screen Size Calculator
From an aspect ratio and one side, find the other; or from a diagonal and ratio, get real width and height (4:3, 16:9, 21:9 …).
Data Storage Unit Converter (B/KB/MB/GB/TB)
Convert between bytes, KB, MB, GB, TB and PB — distinguishing decimal (1000-base, drive labels) from binary (1024-base, OS-reported).
RGB ↔ HEX ↔ HSL Color Converter
Convert between HEX (#RRGGBB), RGB(0–255) and HSL(0–360, 0–100, 0–100) instantly — with a live colour preview swatch.
Tire Size Calculator (Spec / Diameter / Speedometer Error)
Convert a P-metric tire spec (e.g. 225/65R17) into sidewall height, overall diameter, circumference and revolutions per km — and compare against a reference size to see speedometer error.
Energy Unit Converter (J / kJ / cal / kcal / kWh / BTU / Wh)
Convert between joules, kilojoules, calories, kilocalories, kilowatt-hours, BTU and watt-hours in a single view — for nutrition labels, electricity bills, heating and fuel comparisons.
Pressure Unit Converter
Convert between Pa, kPa, bar, mbar, atm, psi, mmHg, Torr and inHg in a single view — all the everyday pressure units.
Torque Unit Converter
Convert between N·m, kgf·m, kgf·cm, lbf·ft, lbf·in and ozf·in — all the torque units used on torque wrenches, bicycle bolts and car service specs.
Angle Unit Converter
Convert between degrees, radians, gradians, turns, arcminutes, arcseconds, milliradians and NATO mil — with live sin/cos/tan values for reference.
Fuel Economy Converter (MPG ⇄ L/100km)
Convert between L/100km, km/L, US MPG and UK (imperial) MPG — compare car efficiency figures across regions without arithmetic.
Power Unit Converter
Convert between W, kW, MW, mechanical horsepower (hp), metric horsepower (PS), BTU/hr, ft·lbf/s, cal/s, kcal/h and refrigeration tons in one view.
Alcohol ABV ↔ Proof Converter & Standard Drinks Calculator
Convert alcohol by volume (ABV %) to US proof and UK proof, plus compute grams of pure alcohol and "standard drinks" per pour for US / UK / AU / HK.
Bandwidth & Throughput Converter (Mbps ↔ MB/s)
Convert network bandwidth (kbps, Mbps, Gbps) to file-transfer rate (KB/s, MB/s, MiB/s) and estimate how long a given file size takes.
Weight / Mass Unit Converter
Kilograms, grams, milligrams, pounds, ounces, stones, tonnes, jin and tael — common mass units, converted instantly.
Battery mAh ↔ Wh Converter (Power Bank Airline Rules)
Enter battery capacity (mAh) and voltage (V) to get watt-hours (Wh) instantly — with a live IATA airline check (100 Wh / 160 Wh cut-offs).
International Bra Size Converter
Enter underbust and bust (or pick a local size) to convert bra sizes across US, UK, EU, AU and JP standards.
International Ring Size Converter
Enter inner circumference (mm) or diameter to cross-reference US, UK, EU, JP and HK ring sizes.