PX to PT Converter

What Is a PX to PT Converter?

A PX to PT converter translates pixel values into typographic points, a unit used across print design, CSS, and operating system font rendering. These two units are not interchangeable by default. The result depends entirely on the screen's DPI (dots per inch).

The Core Formula

PX vs. PT: Key Differences

Property	Pixel (PX)	Point (PT)
Unit type	Screen	Print / absolute
Fixed size?	No, varies by DPI	Yes, 1/72 inch
Common use	Web, UI design	Typography, print, CSS font-size
At 96 DPI	1 px	0.75 pt
At 72 DPI	1 px	1 pt

Common Conversions at 96 DPI

Most desktop screens run at 96 DPI. Here are the values you will reach for most often:

• 12 px = 9 pt
• 16 px = 12 pt (standard body text)
• 24 px = 18 pt
• 32 px = 24 pt
• 48 px = 36 pt

---

When Do You Actually Need This?

More often than you might think. The conversion comes up when:

1. Handing off web designs to print production
2. Setting font sizes in PDF generation libraries
3. Working with CSS pt units for print stylesheets
4. Matching type size between a Figma screen file and an InDesign layout
5. Configuring font sizes in iOS or macOS development

Why DPI Changes Everything

A pixel on a standard 96 DPI monitor is not the same physical size as a pixel on a 192 DPI retina display. Points do not change. This is why the same CSS font-size: 16px can look different in print versus on screen: points anchor to inches, pixels do not.

Use the DPI selector above to match your specific output context. When in doubt, 96 DPI is the right starting point for most screen work.

---

Further reading: W3C CSS absolute length units  ·  MDN: CSS values and units

What Is the Difference Between PX and PT?

PX and PT measure the same thing (type size, spacing, dimensions) but in completely different contexts. One is tied to screens, the other to physical print. Mixing them without conversion produces inconsistent results across media.

Property	PX (Pixel)	PT (Point)
Context	Screen / digital	Print / physical
Size basis	Depends on screen DPI	Fixed: 1/72 of an inch
Resolution dependency	Yes	No
Default tool	Figma, CSS, Adobe XD	InDesign, Illustrator, Word
Origin	Digital computing	15th-century typography

What Is a Pixel (PX)?

A pixel is a screen-relative unit tied to device resolution. Its physical size changes depending on screen DPI and device pixel ratio.

The CSS specification defines 96px as equal to 1 inch at standard screen resolution. On a Retina display (device pixel ratio of 2), 1 CSS pixel maps to 2 physical pixels, but the mathematical conversion to PT stays anchored at the 96 DPI baseline.

Pixels are the default unit in CSS, Figma, and Adobe XD for all screen-based design work.

What Is a Point (PT)?

A point is a physical, absolute unit equal to 1/72 of an inch. It does not change based on the device or display. Print a document at 12pt and measure it, and you get exactly 1/6 of an inch, every time.

Points have been the standard unit in typography since the printing press era. Today, Adobe InDesign, Adobe Illustrator, and most word processors default to PT for type sizing.

Key difference: PT gives you physical certainty. PX gives you screen precision. They serve different outputs.

---

What Is the Formula for Converting PX to PT?

The formula for converting pixels to points is: PT = PX × 0.75.

This is derived from the relationship between the two units and the 96 DPI web standard. There are 72 points in an inch and 96 pixels in an inch (at standard screen resolution). Dividing 72 by 96 gives you 0.75, the constant multiplier.

Worked Examples

PX Value	PT Value	Notes
16px	12pt	Web body text standard
24px	18pt	Common subheading size
32px	24pt	H2-level heading size
48px	36pt	Display heading
72px	54pt	Large display type

The reverse formula: PX = PT ÷ 0.75 (or PT × 1.333).

So 12pt converts back to exactly 16px. That 16px / 12pt pairing is worth memorizing if you work across screen and print regularly.

The 72 DPI Exception

At 72 DPI (the legacy Mac screen standard), the ratio changes completely: 1px = 1pt.

This applied to older Apple displays before they standardized to 96 DPI. You will still encounter this in some older InDesign workflows and legacy Photoshop documents. Always confirm the DPI baseline before running a batch conversion.

---

PX to PT Conversion Chart

The chart below covers the most common type sizes used in web and print design, based on the 96 DPI standard (PT = PX × 0.75).

PX	PT (96 DPI)	PT (72 DPI)	Common Use
8px	6pt	8pt	Fine print, captions
10px	7.5pt	10pt	Small labels
12px	9pt	12pt	Secondary text
14px	10.5pt	14pt	UI labels
16px	12pt	16pt	Body text default
18px	13.5pt	18pt	Large body / small heading
20px	15pt	20pt	Subheadings
24px	18pt	24pt	H3-level headings
28px	21pt	28pt	H2-level headings
32px	24pt	32pt	Section headings
36px	27pt	36pt	Page titles
48px	36pt	48pt	Display type
64px	48pt	64pt	Hero headings
72px	54pt	72pt	Large display
96px	72pt	96pt	Decorative / poster type

Standard print type sizes (6pt, 8pt, 10pt, 12pt, 14pt, 18pt, 24pt, 36pt, 48pt, 72pt) map cleanly to web sizes at 96 DPI. The 16px = 12pt pairing is by far the most used in cross-media design handoff.

---

Where Is PX to PT Conversion Used?

PX to PT conversion appears in 4 distinct workflows: web-to-print handoffs, CSS print stylesheets, iOS/macOS development, and PDF generation. Each one handles the unit relationship differently.

Web to Print Design Handoff

The problem: A brand system built in Figma specifies all type in pixels. The print vendor needs InDesign files with point values.

A designer working on a brand identity for a retail client will set body copy at 16px in Figma. The same spec in InDesign needs to read 12pt. Without conversion, the output looks correct on screen but prints at the wrong size.

90% of design firms worldwide engage in print-related projects annually (Design Week). Most of them hit this unit translation issue on every project that crosses the screen-to-print boundary.

CSS Print Stylesheets

CSS supports both px and pt as valid length units. But inside an @media print block, pt is the more reliable choice.

Browsers apply their own scaling logic when rendering pixels to print. Declaring PT values directly removes that ambiguity. A font set to 12pt in a print stylesheet outputs at exactly 12pt on paper. The same font set to 16px may render differently across browsers.

Practical note: Most developers skip @media print stylesheets entirely. That is a mistake on any page meant to be printed (invoices, reports, editorial content).

iOS and macOS Development

This is where the naming gets confusing. Apple's UIKit and SwiftUI use "points" (pt) as their layout unit, but this is not the same PT as typographic points.

Apple's pt is a device-independent unit. On a standard display, 1 Apple pt = 1 physical pixel. On a Retina (2x) display, 1 Apple pt = 2 physical pixels. The iOS Human Interface Guidelines specify all typography in this system. For example, SF UI Text applies to text set at 19pt or smaller, while SF UI Display applies at 20pt or larger.

Converting typographic PT to Apple's UI pt requires knowing the device's pixel density, which varies across the iPhone and iPad lineup.

PDF and Document Generation

PDF coordinates and font sizes are defined in typographic points. 72pt = 1 inch, and this is fixed in the PDF specification.

Tools that generate PDFs programmatically (wkhtmltopdf, Puppeteer, WeasyPrint) require PT values for accurate page dimensions and font sizing. Passing PX values directly often produces output that looks right on screen but renders at unexpected sizes in the PDF.

This comes up constantly in invoice generators, report builders, and any system that outputs printable PDFs from web-based templates.

---

How Do Design Tools Handle PX and PT?

Design tools do not treat units consistently. Some convert automatically. Others require manual input. Knowing which tool does what saves time on every cross-media project.

Tool	Default Unit	PT Support	Auto-Conversion
Figma	PX	No native PT display	Manual only
Adobe InDesign	PT / Picas	Native	Yes (Document Setup)
Adobe Illustrator	PX or PT	Both	Yes (Document Setup)
Sketch	PX (screen), PT (iOS export)	Partial	Export specs only
Canva	Abstracted	Internal PT for print	Automatic
CSS	PX default	Both valid	No (manual in @media print)

Figma

Figma works in pixels by default and has no native PT display in its interface.

When handing off designs to print, designers either convert manually using the 0.75 multiplier or use a Figma Community plugin. The "Unit Converter" plugins in the Figma Community handle this in-canvas. Figma's 2024-2025 data shows 84% of designers collaborate with developers at least weekly (Figma, 2025), and unit translation is one of the top friction points in that handoff.

Adobe InDesign

InDesign defaults to PT and picas. It is built for print, so all type specifications land in points by default.

When importing assets or specs from a Figma or CSS-based web project, the designer must convert incoming PX values before applying them. InDesign lets you set the base unit in Preferences under Units & Increments, and it supports values between 60 and 80 points per inch (default: 72).

Adobe Illustrator

Illustrator supports both units and lets you switch between them in Document Setup.

At 72 DPI (Illustrator's legacy default for print), 1px = 1pt. At 96 DPI (screen-standard), 1px = 0.75pt. This means an Illustrator file set up for screen and one set up for print will produce different PT values for the same numerical PX input. Worth checking the document DPI before starting any conversion-sensitive project.

Sketch

Sketch uses the macOS coordinate system, which is measured in points. When working on iOS designs, Sketch treats 1pt as 1 unit, and then exports assets at @1x, @2x, and @3x scales for the different device pixel densities.

This is Apple's UI point system, not typographic PT. The numbers look similar, but they refer to different physical sizes.

---

How Does Screen Resolution Affect PX to PT Conversion?

Screen resolution directly changes the output of any PX to PT conversion. The same pixel value produces a different point value depending on which DPI baseline the tool or document uses.

Two baselines, two different outputs:

DPI Standard	Conversion Ratio	Who Uses It
96 DPI (web standard)	1px = 0.75pt	CSS, Figma, modern workflows
72 DPI (legacy)	1px = 1pt	Older Mac displays, some print setups

The 96 DPI standard was set when the web was first designed, at a time when nearly all displays ran at exactly 96 DPI (web.dev, Google). That fixed ratio became the W3C baseline for CSS length calculations.

The Device Pixel Ratio (DPR) Factor

Modern smartphones report a device pixel ratio of 2 or higher, meaning physical pixels outnumber CSS pixels 2-to-1 or more (MDN Web Docs).

This does not change the conversion formula itself. The math still runs at the 96 DPI baseline. But the visual result at print differs because the device renders sharper output than the formula accounts for.

An iPhone 15 Pro Max, for example, runs at 460 PPI with a DPR of 3. The CSS pixel remains a logical unit. The point conversion stays at 0.75. The sharpness increases.

Retina and High-DPI Displays

Apple introduced Retina displays in 2010 with the iPhone 4, doubling the pixel density by replacing each screen pixel with 4 smaller pixels (Wikipedia).

What this means in practice:

• A 16px font on a 1x display = 12pt, rendered at standard resolution

• The same 16px font on a 2x Retina = 12pt mathematically, but physically sharper

• Smartphone average PPI reached 420 in 2024, up from 350 in 2019 (Gitnux)

The PX-to-PT conversion value stays fixed. What changes is the quality of rendering at that size. This is why a 12pt print specification still looks correct next to a Retina-rendered 16px screen element.

---

What Is the PX to PT Conversion for Typography Specifically?

Typography is where PX-to-PT conversion matters most. Get it wrong and the print output does not match the screen design. The gap shows up clearly at small sizes.

16px = 12pt is the most referenced pairing in cross-media type work. It corresponds to the browser default body text size and the standard print body text size simultaneously. That overlap is not a coincidence.

Web Body Text and Print Body Text Standards

16px is the default CSS root font size across all major browsers. 12pt is the standard body text size in print documents, word processors, and editorial guidelines.

Both equate to the same physical output at 96 DPI. This makes 16px / 12pt the anchor point for any typographic scale that needs to work on both screen and page.

WCAG 2.1 defines large text as 18pt (approximately 24px) or 14pt bold (approximately 18.66px), where a lower contrast ratio of 3:1 applies instead of the standard 4.5:1 (The A11Y Collective, 2025).

Heading Scales in PX and PT

Type hierarchies look consistent only when the scale is applied correctly across both unit systems.

Common heading conversions at 96 DPI:

• H1 / display: 48px = 36pt

• H2 / section: 32px = 24pt

• H3 / subsection: 24px = 18pt

• H4 / label: 20px = 15pt

• Body: 16px = 12pt

• Caption / small: 12px = 9pt

Typography in CSS rem and How It Connects to PT

CSS rem values derive from the root font size, which defaults to 16px. So 1rem = 16px = 12pt at standard settings.

This three-unit relationship (rem, px, pt) lets designers build a single typographic scale that translates cleanly to screen, email, and print. Google's Material Design uses rem-based scales internally. Apple's HIG specifies everything in points for iOS, with body text defaulting to 17pt in SwiftUI (iOS Human Interface Guidelines).

The leading between lines, the tracking across letter pairs, and kerning between specific characters all carry over in converted point values, since they are typically set as multipliers or percentages of the base type size rather than fixed unit values.

---

How to Convert PT Back to PX

Reverse conversion is just as common as forward conversion. Print briefs arrive in points. Web builds run in pixels. Translating one into the other goes both directions.

The reverse formula: PX = PT ÷ 0.75

Or equivalently: PX = PT × 1.333.

Common Reverse Conversions

At 96 DPI:

PT Value	PX Equivalent	Rounding Note
6pt	8px	Exact
8pt	10.67px	Round to 11px
10pt	13.33px	Round to 13px
12pt	16px	Exact
14pt	18.67px	Round to 19px
18pt	24px	Exact
24pt	32px	Exact
36pt	48px	Exact

Handling Decimal PX Values

Non-integer pixel values (10.67px, 13.33px) are valid in CSS but browsers handle sub-pixel rendering differently.

Chrome rounds to the nearest physical pixel. Safari uses sub-pixel anti-aliasing. Firefox tends to render fractional values more literally. In practice: round up for font sizes (favor legibility), round down for spacing (favor tighter control).

The PT to PX reverse conversion is useful specifically when working from a print brief into a digital interface, which happens often in brand identity projects that span both media.

For related conversions in the same workflow, PT to CM handles the physical dimension side, while REM to PX and EM to PX cover the relative unit conversions that come up in CSS work.

---

What Are Common Mistakes When Converting PX to PT?

Most conversion errors come from one of 3 sources: a wrong DPI assumption, a naming collision between unit systems, or rounding handled inconsistently across a project.

94.8% of home pages fail basic WCAG accessibility standards (WebAIM, 2025). Some of that failure traces back to type sizes set incorrectly during the screen-to-print translation process.

Assuming 1px = 1pt

This is the single most common mistake. It is only valid at 72 DPI legacy setups.

At 96 DPI (the current web standard), 1px = 0.75pt. Applying the wrong ratio shifts every font size in the document. A 16px body text specification becomes 16pt instead of 12pt. That is 33% larger than intended.

Hard-coding pixel values without verifying the DPI baseline causes sizing inconsistencies across print outputs, particularly when typographic specs move between Figma and InDesign without a declared unit standard (Quora, design community discussion).

Confusing Apple's UI Point With Typographic PT

Two completely different units share the same abbreviation. Apple's UIKit pt is a device-independent pixel. Typographic pt is 1/72 of an inch.

On a standard iOS display, 1 Apple pt = 1 CSS px. On a Retina display, 1 Apple pt = 2 physical pixels. Neither of these equals the typographic point used in CSS or print, except by coincidence at certain display densities.

W3C design token discussions from 2023 flagged this exact collision as a source of persistent confusion in cross-platform design systems (W3C public design tokens log, May 2023).

Rounding Decimal PT Values Inconsistently

10pt = 13.33px. Rounding this to 13px in one file and 14px in another creates mismatches across a design system.

Fix: Define a rounding rule at the start of the project and apply it everywhere. Round font sizes up (13.33 → 14px). Round spacing values down (13.33 → 13px). Document the choice.

Applying Print PT Values Directly Into CSS

A print brief specifying 10pt body text gets pasted into a CSS font-size rule as font-size: 10pt. On screen, 10pt renders at 13.33px. At the default browser zoom, this is noticeably small.

The correct step: convert 10pt to 13px or 14px for screen use, or write the CSS in pixels (13px) and let the @media print stylesheet handle the PT value separately.

For understanding the broader font measurement context and how these units relate to typography elements like x-height and typographic hierarchy, those concepts sit upstream of any unit conversion and affect how type reads at any given size.

Other converters relevant to this workflow include EM to REM, REM to EM, Inch to PX, MM to PX, and CM to PX for when physical dimensions need to move into screen-based units.

FAQ on PX to PT Converters

How do I convert px to pt?

Multiply the pixel value by 0.75. That gives you the point equivalent at the 96 DPI web standard. So 16px = 12pt, 24px = 18pt, 32px = 24pt. Simple arithmetic, no tool required.

What is the difference between px and pt?

Pixels are screen-relative units tied to display resolution. Points are physical units equal to 1/72 of an inch. PX changes with device DPI. PT stays fixed regardless of screen or output device.

Is 12pt the same as 16px?

Yes, at 96 DPI. The CSS standard defines 96 pixels per inch and 72 points per inch. That ratio makes 16px exactly equal to 12pt. This is the most common pairing in web-to-print typography work.

Why does my converted pt value look different on screen vs print?

Screen rendering and print output use different DPI baselines. Your screen displays at 96 DPI. Legacy print setups sometimes use 72 DPI, where 1px = 1pt instead of 0.75pt. Always confirm which baseline your tool assumes.

What is the pt unit used for in CSS?

CSS supports pt as an absolute length unit. It works correctly in @media print stylesheets, where 12pt outputs as exactly 12pt on paper. For screen layouts, px or rem are more reliable choices.

Does Apple's pt unit equal typographic pt?

No. Apple's UIKit and SwiftUI use points as device-independent pixels, not typographic points. On a standard display, 1 Apple pt equals 1 CSS px. On Retina, it maps to 2 physical pixels. Different concept, same abbreviation.

What is the minimum readable font size in pt for print?

6pt is the practical lower limit for print captions and fine print. Body text should be 10pt minimum for comfortable reading. The WCAG equivalent on screen is 16px (12pt) for body copy.

How do I convert pt back to px?

Divide the point value by 0.75, or multiply by 1.333. So 12pt = 16px, 18pt = 24px, 36pt = 48px. For values like 10pt, the result is 13.33px. Round up for font sizes, down for spacing.

Which design tools use pt by default?

Adobe InDesign and Illustrator default to points for type sizing. Microsoft Word and Google Docs also use pt. Figma, Sketch, and most CSS workflows default to pixels. Canva abstracts the unit internally but outputs pt for print products.

Can I use pt in responsive CSS layouts?

Not reliably. Point values are absolute, so they do not scale with browser zoom or user font preferences. For responsive web design, use rem or em instead. Reserve pt for @media print stylesheets where physical size accuracy is the goal.