Percent to PT Converter
Convert between Percentage (%) and Points (pt) CSS units with customizable DPI and parent font size
Live Font Size Preview
Hello
Conversion Formula
How Percent and Points relate to each other via pixels
% → PT
pt = (% ÷ 100) × parent × (72 ÷ dpi)
e.g. (100 ÷ 100) × 16 × (72 ÷ 96) = 12pt
PT → %
% = pt × (dpi ÷ 72) ÷ parent × 100
e.g. 12pt × (96 ÷ 72) ÷ 16 × 100 = 100%
CSS Style Properties
Percent value
p {
font-size: 100%;
}PT value
p {
font-size: 0pt;
}Percent to PT Conversion Table
Based on parent font size: 16px, DPI: 96
| Percent (%) | Points (pt) | Pixels (px) |
|---|---|---|
| 25% | 3pt | 4px |
| 50% | 6pt | 8px |
| 75% | 9pt | 12px |
| 100% | 12pt | 16px |
| 125% | 15pt | 20px |
| 150% | 18pt | 24px |
| 175% | 21pt | 28px |
| 200% | 24pt | 32px |
| 225% | 27pt | 36px |
| 250% | 30pt | 40px |
| 275% | 33pt | 44px |
| 300% | 36pt | 48px |
| 325% | 39pt | 52px |
| 350% | 42pt | 56px |
| 375% | 45pt | 60px |
| 400% | 48pt | 64px |
| 425% | 51pt | 68px |
| 450% | 54pt | 72px |
| 475% | 57pt | 76px |
| 500% | 60pt | 80px |
About Percent to PT Conversion
What is Percent (%)?
Percent (%) is a relative CSS unit based on the parent element's corresponding property.
For font-size, 100% equals the parent element's font size.
It scales automatically with the parent, making it ideal for responsive and accessible designs.
What is PT (Points)?
PT (Points) is a typographic unit originating in print design. One point equals 1/72 of an inch. In CSS, pt is an absolute unit — at 96 DPI (standard screen), 1pt ≈ 1.333px. PT is commonly used in print stylesheets and email templates.
The Conversion Formula
pt = (% ÷ 100) × parentFontSize × (72 ÷ dpi)
At 96 DPI and a 16px parent: 100% = 12pt. The formula chains %→px (via parent size) then px→pt (via DPI).
Common Conversions (DPI=96, parent=16px)
50%
6pt
62.5%
7.5pt
75%
9pt
87.5%
10.5pt
100%
12pt
112.5%
13.5pt
125%
15pt
150%
18pt
How to Use the Percent to PT Converter
- 1
Enter your value
Type the percentage (or pt) value you want to convert into the "From Value" input field.
- 2
Select the unit direction
Choose % or pt in both dropdowns. Use the swap button to reverse direction instantly.
- 3
Adjust settings if needed
Click Show Settings to change the parent font size (default 16px) and screen DPI (default 96). Both affect the conversion result.
- 4
Read the result and copy
The converted value appears instantly in the "To Value" field. Click the Copy button to copy it to your clipboard.
- 5
Check the live preview and table
The Live Font Size Preview shows how the result looks visually. The conversion table below lists 25% increments with their pt and pixel equivalents.
Tip: At 96 DPI and a 16px parent, 100% equals exactly 12pt — the standard body text size in print typography. This is a useful anchor point for cross-media design.
Common Use Cases
Web-to-Print Typography
- • Convert a web CSS percentage font size to pt for a print stylesheet
- • Match a
@media printfont size to your web design spec - • Translate a fluid web type scale to fixed pt values for PDF generation
Email Template Development
- • Many email clients support pt for font sizes — convert from your % stylesheet
- • Standardise font sizes across HTML email templates using pt values
- • Match email typography to the equivalent web % value for consistency
Design System Documentation
- • Build a shared reference table showing % and pt equivalents for your type scale
- • Translate design tokens expressed in % to pt for developer and print handoff
- • Reconcile a mixed-unit codebase during a CSS typography refactor
Accessibility Adjustments
- • Verify that percentage-based sizes meet minimum pt requirements for print accessibility
- • Ensure print versions of pages have legible type sizes (at least 10–12pt)
- • Convert WCAG-recommended minimum sizes from % to pt for documentation
CMS & Theme Customisation
- • Some CMS theme editors expose pt font size inputs — convert from your % design values
- • Override inherited percentage font sizes with a calculated pt value for print
- • Audit legacy stylesheets for inconsistent pt and % usage
Learning & Teaching CSS
- • Understand the relationship between % and pt via DPI and parent font size
- • Demonstrate the difference between relative and absolute CSS units
- • Use the live preview to show students visual font size differences instantly
Frequently Asked Questions
What is the formula to convert percent to PT?
The formula is: pt = (% ÷ 100) × parentFontSize × (72 ÷ dpi). At 96 DPI with a 16px parent, 100% = 12pt. The conversion chains %→px (via parent size) then px→pt (via DPI).
Why does 100% equal 12pt by default?
100% of the default 16px parent equals 16px. At 96 DPI, converting 16px to pt: 16 × (72/96) = 12pt. This is also why 12pt is the standard body text size in word processors and print design.
When should I use PT instead of percent in CSS?
PT is best for print stylesheets (@media print) or email clients that expect absolute units. Percent is better for web layouts because it scales relative to the parent and respects user font size preferences.
Does the DPI setting affect the conversion?
Yes. DPI determines how many pixels one point equals. At 96 DPI (screen), 1pt ≈ 1.333px. At 72 DPI (print), 1pt = 1px exactly. Changing DPI in the settings recalculates all conversions accordingly.
What does changing the parent font size do?
The parent font size determines what 100% resolves to in pixels. If the parent is 20px instead of 16px, then 100% = 20px, which then converts to a different pt value. Always set the parent font size to match your actual CSS context.
How do I convert PT back to percent?
Use the swap button in this tool, or apply the reverse formula: % = pt × (dpi ÷ 72) ÷ parentFontSize × 100. For example, 18pt at 96 DPI with a 16px parent = 150%.
Is my data safe? Does this tool send data to a server?
No data leaves your browser. All calculations happen entirely client-side using JavaScript. Nothing you enter is uploaded or stored anywhere.
What is the difference between PT and EM?
PT (points) is an absolute unit — it does not change based on context. EM is a relative unit that scales with the nearest parent element's font size. For web typography, EM and % are preferred; PT is reserved for print and email where absolute sizing is expected.