This CM to PX Converter translates centimeter values into pixels instantly, based on your chosen DPI setting. Designers and developers constantly switch between print and screen units. This tool makes that process frictionless.
Key features:
- DPI-aware conversion — choose between common presets like 72, 96, 150, and 300 DPI
- Reverse conversion — swap direction to convert px back to cm
- Common reference values — a built-in table of standard sizes for quick lookup
- Copy result — grab the output with one click
Whether you're preparing assets for print or matching CSS pixel values to a physical spec, accurate unit conversion matters. No guesswork, no manual math. Free to use, no signup required.
How to Use This CM to PX Converter
Pick a DPI pill at the top of the converter above (96 for web, 300 for print, or 72 and 150 for legacy and draft work), then type a centimeter value. The pixel result and the live formula update as you type. Hit the swap button to run px back to cm, and use the Common Reference Values table for A4, business cards and other standard sizes at the selected DPI.
Without knowing the DPI (dots per inch) of your medium, the output is meaningless. Two screens can show the same number of pixels at completely different physical sizes. The converter is used daily in web design, print preparation, and UI prototyping.
The CM to PX Conversion Formula
The conversion is not a fixed ratio. It depends entirely on the pixel density of your target medium:
px = cm ÷ 2.54 × DPI
There are exactly 2.54 centimeters in one inch, so every cm-to-pixel calculation routes through inches as the bridge unit. Centimeters convert to inches first (dividing by 2.54), then the inch value gets multiplied by the DPI or PPI target. No shortcut exists. You always need DPI.
The three parts, broken down:
- cm, the input length you're starting with
- 2.54, the constant number of centimeters in one inch
- DPI, the density value that decides how many pixels fit in that inch
Worked example: take 5 cm at 96 DPI. Divide 5 by 2.54 to get roughly 1.97 inches, then multiply by 96. The result lands at 188.98 px. The same 5 cm at 300 DPI is 5 ÷ 2.54 × 300 = 590.55 px. Same physical size, very different pixel counts, because the inch is the fixed anchor and the pixel count is not.
This is also why how many pixels fit in an inch is really the wrong question on its own. The answer only exists once a DPI value is attached to it.
PX to CM: The Reverse Formula
Going the other way, divide by the DPI first, then multiply by 2.54:
cm = px ÷ DPI × 2.54
- 100 px at 96 DPI → 2.65 cm
- 1920 px at 96 DPI → 50.8 cm
- 1181 px at 300 DPI → 10 cm
The swap button on the converter above runs this direction. For a fuller set of tables solved for centimeters, use the dedicated px to cm converter.
CM to PX Conversion Tables
Lookup values at the four DPI settings the converter offers. At 96 DPI, 1 cm = 37.8 px; at 300 DPI, 1 cm = 118.11 px.
At 96 DPI (Web Standard)
| Centimeters | Pixels |
|---|---|
| 0.1 cm | 3.78 px |
| 0.2 cm | 7.56 px |
| 0.3 cm | 11.34 px |
| 0.4 cm | 15.12 px |
| 0.5 cm | 18.90 px |
| 0.6 cm | 22.68 px |
| 0.7 cm | 26.46 px |
| 0.8 cm | 30.24 px |
| 0.9 cm | 34.02 px |
| 1 cm | 37.80 px |
| 1.5 cm | 56.69 px |
| 2 cm | 75.59 px |
| 2.5 cm | 94.49 px |
| 3 cm | 113.39 px |
| 3.5 cm | 132.28 px |
| 4 cm | 151.18 px |
| 4.5 cm | 170.08 px |
| 5 cm | 188.98 px |
| 6 cm | 226.77 px |
| 7 cm | 264.57 px |
| 8 cm | 302.36 px |
| 9 cm | 340.16 px |
| 10 cm | 377.95 px |
| 12 cm | 453.54 px |
| 15 cm | 566.93 px |
| 17 cm | 641.86 px |
| 20 cm | 755.91 px |
| 21 cm | 793.70 px |
| 25 cm | 944.88 px |
| 29.7 cm | 1122.52 px |
| 30 cm | 1133.86 px |
| 35 cm | 1322.83 px |
| 40 cm | 1511.81 px |
| 50 cm | 1889.76 px |
At 300 DPI (Print Standard)
| Centimeters | Pixels |
|---|---|
| 0.1 cm | 11.81 px |
| 0.2 cm | 23.62 px |
| 0.3 cm | 35.43 px |
| 0.5 cm | 59.06 px |
| 1 cm | 118.11 px |
| 1.5 cm | 177.17 px |
| 2 cm | 236.22 px |
| 2.5 cm | 295.28 px |
| 3 cm | 354.33 px |
| 4 cm | 472.44 px |
| 5 cm | 590.55 px |
| 6 cm | 708.66 px |
| 7 cm | 826.77 px |
| 8 cm | 944.88 px |
| 9 cm | 1062.99 px |
| 10 cm | 1181.10 px |
| 12 cm | 1417.32 px |
| 15 cm | 1771.65 px |
| 17 cm | 2007.87 px |
| 20 cm | 2362.20 px |
| 21 cm | 2480.31 px |
| 25 cm | 2952.76 px |
| 29.7 cm | 3507.87 px |
| 30 cm | 3543.31 px |
| 35 cm | 4133.86 px |
| 40 cm | 4724.41 px |
| 50 cm | 5905.51 px |
At 150 DPI (Draft Print)
| Centimeters | Pixels |
|---|---|
| 1 cm | 59.06 px |
| 2 cm | 118.11 px |
| 3 cm | 177.17 px |
| 5 cm | 295.28 px |
| 10 cm | 590.55 px |
| 15 cm | 885.83 px |
| 20 cm | 1181.10 px |
| 21 cm | 1240.16 px |
| 29.7 cm | 1753.94 px |
| 30 cm | 1771.65 px |
| 40 cm | 2362.20 px |
| 50 cm | 2952.76 px |
At 72 DPI (Legacy Screen)
| Centimeters | Pixels |
|---|---|
| 0.5 cm | 14.17 px |
| 1 cm | 28.35 px |
| 1.5 cm | 42.52 px |
| 2 cm | 56.69 px |
| 2.5 cm | 70.87 px |
| 3 cm | 85.04 px |
| 4 cm | 113.39 px |
| 5 cm | 141.73 px |
| 6 cm | 170.08 px |
| 7 cm | 198.43 px |
| 8 cm | 226.77 px |
| 9 cm | 255.12 px |
| 10 cm | 283.46 px |
| 15 cm | 425.20 px |
| 20 cm | 566.93 px |
| 30 cm | 850.39 px |
The 21 cm and 29.7 cm rows are the two sides of an A4 sheet: 794 × 1123 px at 96 DPI, 2480 × 3508 px at 300 DPI.
What Is a CM to PX Converter?
A CM to PX converter is a small calculation tool that turns a centimeter measurement into its matching pixel value, using screen or print resolution as the conversion factor.
It sits in the same family as other unit converters, but it needs one extra ingredient the others don't: a dots-per-inch or pixels-per-inch reference point.
Without that reference, centimeters and pixels can't talk to each other. A centimeter is a fixed physical length. A pixel isn't, not really.
What sets it apart from a generic length converter:
- It requires a DPI or PPI input before it can produce a number
- The output changes depending on the target medium (screen or print)
- It bridges a physical unit and a resolution-dependent unit, not two physical units
Ask what px actually stands for and you get the root of the problem: it's short for picture element, a unit tied to a device's resolution rather than to a ruler.
That's the whole reason this converter exists as its own category of tool, separate from something that just swaps centimeters for inches.
How DPI and PPI Change the CM to PX Ratio
DPI and PPI decide the ratio between a physical length and its pixel count, and changing either one changes the output of the entire formula.
Dpi stands for dots per inch and applies to print output. Ppi stands for pixels per inch and applies to screens.
They get used almost interchangeably in casual conversation. But a printer lays down dots of ink while a screen lights up pixels, so the two terms describe different physical processes even when the math behind them is identical.
The W3C's own CSS Values and Units specification pins the CSS pixel to a fixed reference: a device at 96 dpi, where 1px equals 1/96 of an inch, or about 0.26mm.
Reference values used across web and print work:
- 96 dpi, the CSS and general web design default
- 150 dpi, a mid-tier print setting for posters and large-format signage
- 300 dpi, the standard floor for sharp photo and document printing
- 326 ppi, the density Apple introduced with its first Retina-class phone display
Run the same 5 cm through all four and the pixel output moves from 189, to 295, to 591, to roughly 642. There is no dpi that is objectively correct.
There's only the one that matches where the pixels are going to end up.
Why the Same Centimeter Value Produces Different Pixel Results Across Screens
A centimeter never changes. A pixel's physical size does, which is why the same conversion can look completely different from one screen to the next.
Device pixel ratio is the culprit. It describes how many actual hardware pixels get packed into the space of a single CSS pixel.
On a standard display, that ratio sits at 1:1. On a high-density screen, it climbs to 2:1 or 3:1, meaning two or three physical pixels are doing the work of one.
Apple's original Retina display on the iPhone 4 shipped at 326 pixels per inch, roughly double the density of the phone screens that came before it. That single change is enough to make identical cm values render at visibly different sizes.
Three variables stack on top of each other here:
- Physical screen size, measured in inches or centimeters
- Native resolution, the raw pixel count the panel supports
- Pixel density, which is what you get once size and resolution are combined
Operating system scaling adds a fourth layer on top. Windows and macOS both apply their own scaling factors on high-density hardware. Two screens with identical native resolutions can still display a converted cm value at different visual sizes.
CM, MM, Inch, and PX Compared for Design Work
Choosing between cm, mm, inch, and px comes down to one question: is the output going to a screen or to paper?
Cm, mm, and inch are physical units. They mean the same thing on every ruler, everywhere, regardless of what device is displaying them.
Px is not physical. Its size depends entirely on the density of the screen rendering it, which is the whole reason a converter is needed in the first place.
| Unit | Physical basis | Typical use | Screen dependent |
|---|---|---|---|
| Centimeter | Fixed, metric | Print layouts, packaging | No |
| Millimeter | Fixed, metric | Fine print detail, die lines | No |
| Inch | Fixed, imperial | US print standards, screen diagonals | No |
| Pixel | Resolution-based | Web layouts, UI design | Yes |
Print work leans on cm and mm because paper doesn't change size depending on what's rendering it. That's also the logic behind ISO 216, the standard that fixes A4 at 210 × 297 mm everywhere it's printed.
Anyone converting values in the other direction can run the same math through a px to inches converter, which is the same formula solved for the opposite unit.
Knowing how many millimeters make up an inch matters here too, since it's the same 2.54 constant sitting underneath every one of these conversions.
Which DPI Setting to Use for Web, Print, and Retina Design
The dpi setting isn't a personal preference. It's dictated by where the pixels are going to be viewed.
Web and UI Design
96 dpi is the default for browsers, CSS, and standard UI work; 1 cm = ~37.8 px.
It's the value baked into the CSS reference pixel itself, so building at anything else means fighting the platform instead of working with it.
- Matches the CSS specification's own baseline
- Keeps layout math predictable across ordinary displays
- Is the safest default when the final viewing device is unknown
72 dpi is the older legacy standard from early Mac screens. It still shows up in some export settings, but it is rarely the right choice for anything built today.
Standard Print Output
300 dpi is the floor for anything printed and viewed up close; 1 cm = ~118 px.
The Federal Agencies Digitization Guidelines Initiative treats 300 dpi as the benchmark for capturing 80 to 90 percent of an original document's visible detail during archival scanning.
Business cards, brochures, and photo prints all sit in this range. Drop below it and the eye starts to catch individual dots at normal reading distance. 150 dpi covers lower-quality output such as newspapers, draft proofs, and large-format signage viewed from a distance.
Ask your print shop for their DPI requirement before converting. Don't assume 300 every time.
The difference between the two disciplines is covered in more depth on the page comparing dpi and ppi directly. A fuller breakdown of the print number itself lives on the 300 dpi reference page.
Retina and High-Density Screens
326 ppi and up: mobile and tablet displays built for close viewing. The device pixel ratio (DPR) means one CSS pixel maps to 2 or 3 physical pixels, while the logical resolution still uses 96 dpi as the base.
Design at 1x, export at 2x or 3x: the common workflow for shipping assets that stay sharp on dense panels.
Undershoot this target and images look soft next to the surrounding text, even though nothing about the cm value used to build them was wrong.
Converting CM to PX in Photoshop, Illustrator, Figma, and Canva
Design tools don't all treat this conversion the same way, and the differences matter once a file has to move between them.
Photoshop and Illustrator
Both tools tie the conversion to a document-level resolution setting.
Set the file to 300 dpi and every cm value entered converts using that number. Switch it to 72 or 96 later, and existing artwork doesn't recalculate itself automatically.
- Pros: full manual control over the dpi used for every element
- Pros: accepts direct cm and mm input for print-native workflows
- Cons: resolution mismatches between documents cause silent sizing errors
Figma and Sketch
Figma's own documentation shows plainly that the platform's default measurement unit is the pixel, and layouts and components are specified in px throughout.
There's no native centimeter input. Anyone handed a print spec in cm has to run the conversion before entering a single number.
- Pros: pixel-native workflow matches how browsers actually render layouts
- Pros: removes the resolution-mismatch risk that print-first tools carry
- Cons: no built-in path for cm or mm, so print-facing work needs a separate calculation step
Canva
Canva sits in between the two approaches. It accepts a direct cm input on custom canvas sizes and converts it internally before rendering the design.
The tradeoff shows up on export.
- Pros: lets a user type a real-world size without doing the math first
- Cons: gives less visibility into which dpi value is actually running behind the scenes
Anyone exporting a Canva or Figma canvas back into a print spec sheet can reverse the process with a px to cm converter rather than recalculating it by hand.
How to Convert CM to PX Step by Step
Converting a cm value into pixels always follows the same order of operations, regardless of which tool ends up doing the math.
Skip a step and the final number comes out wrong, usually because the dpi target got picked after the calculation instead of before it.
- Step 1: Confirm the target medium first, screen or print, since that decides which dpi or ppi value applies
- Step 2: Pick the exact dpi number for that medium (96 for standard web, 300 for print, 326 or higher for a retina target)
- Step 3: Divide the cm value by 2.54 to convert it into inches
- Step 4: Multiply the inch value by the chosen dpi to get the pixel count
- Step 5: Round to the nearest whole pixel, since a display can't render a fractional one
A 10cm banner heading built for a 300 dpi print run converts to roughly 1181 pixels.
Run the same 10cm through 96 dpi instead and it drops to about 378 pixels. Same physical length, two completely different outputs, because the dpi choice happened before the math, not after it.
CM to PX in CSS: Absolute vs Relative Units
The CSS Values and Units Module fixes the ratio between absolute units at 1in = 2.54cm = 96px = 72pt = 6pc, so cm and px are never independent of each other inside a stylesheet.
Relative units don't work that way. Their pixel output depends on something else in the page, not on a fixed conversion table.
| Unit type | Examples | Depends on | Best for |
|---|---|---|---|
| Absolute | cm, mm, in, pt, px | A fixed ratio to each other | Print stylesheets, precise sizing |
| Relative | em, rem, vw, vh | Font size or viewport dimensions | Fluid, responsive layouts |
Most browsers set the root font size at 16px by default, which is why 1rem quietly equals 16px until someone changes it.
Writing width: 5cm directly in a stylesheet technically works, since CSS absolute units support it. The browser still renders it as a fixed pixel count under the hood.
That fixed count doesn't adjust when the viewport resizes, which is exactly the gap that media queries and relative units exist to close.
Common Errors When Converting CM to PX
Wrong reference value: using 96 dpi for a file that's headed to a printer, or 300 dpi for something that's only ever going to appear on a screen.
Treating px as physical: assuming a 500px element will always measure the same on a ruler, when its physical size shifts with every device's pixel density.
Ignoring browser rounding: WebKit-based browsers apply a fixed 96px-per-inch ratio to every absolute unit, while Gecko has historically tried to match the display's real physical dpi instead. MDN's length reference documents the 96px-per-inch anchor and the fact that absolute units only map to physical sizes on print media.
That disagreement between rendering engines means the exact same cm value in the exact same stylesheet can render at slightly different pixel widths depending on which browser opens it.
Compounding rounding errors: a small fractional pixel gets rounded once, then that rounded number gets used as the input for a second calculation. The drift adds up across a large canvas.
Most of these mistakes trace back to the same root cause. Whoever set up the file didn't check the number against a cross-browser compatibility test before shipping it. Or they assumed a fixed pixel value would behave consistently across the kind of flexible layouts that responsive design is built around.
When CM to PX Conversion Does Not Apply
A cm to px conversion assumes a fixed target resolution. Take that assumption away and the whole calculation stops meaning anything.
Vector formats sidestep it entirely. The W3C's own SVG specification describes the format as a resolution-independent description of a graphic, not a grid of pixels. There's no single px value to convert toward in the first place.
- An SVG icon scales cleanly at any size because it was never tied to a pixel count
- Cross-device UI work can't use one converted px value, since the same number looks different on every screen density it lands on
- A print job with no confirmed final dpi makes any pixel figure provisional until that number is locked in
- Fluid layouts often need relative units instead of pixels, since a fixed conversion defeats the point of a layout that's supposed to flex
None of this makes the formula wrong. It just means the formula only holds inside a specific, known resolution. The moment that resolution isn't fixed, neither is the pixel value it produces.
FAQ on CM To PX Converter
What is the difference between a CSS pixel and a physical pixel?
A CSS pixel is a fixed reference unit browsers use for layout, roughly 1/96 inch. A physical pixel is an actual hardware dot on the display. High-density screens pack two or three physical pixels into one CSS pixel, which is why device pixel ratio exists.
Is a pixel a fixed physical unit?
No. A pixel's physical size depends entirely on a screen's resolution and density. The same pixel count renders larger on a low-density monitor and smaller on a high-density one, unlike a centimeter or inch, which never change.
How many pixels are in 1cm at 96 dpi?
One centimeter equals roughly 37.8 pixels at 96 dpi, rounding up to 38px since browsers can't render a fractional value. That figure scales directly from the 96 dpi reference pixel baseline down to a single centimeter.
Does browser zoom affect a CM to PX conversion?
Zoom changes what a user sees, not the underlying conversion. Browsers scale the rendered CSS pixels visually, but the calculated px value from a fixed cm and dpi input stays the same in the stylesheet.
Is there a single universal CM to PX value?
No single value applies everywhere. The result always depends on the dpi or ppi target chosen, so the same physical length produces a different pixel count on every screen density the converter targets.
What Should You Check Before Trusting a CM to PX Converter Result?
A CM to PX Converter result holds up only when the dpi target, the export scale, and the rendering engine all match the device the pixels will actually appear on. Otherwise the number looks right and renders wrong everywhere else.
Three checks catch most mismatches before they reach production.
- Confirm the dpi or ppi target matches the output medium
- Match the export scale to the device pixel ratio
- Test the rendered result across more than one rendering engine
A value built at the 96dpi CSS reference needs close to 3.4x scaling to stay sharp on a 326ppi retina panel. Neither figure states that ratio on its own.
Fluid layouts that need to scale between two pixel values instead of one fixed number are better handled with a CSS clamp calculator, which picks up exactly where a fixed conversion stops being enough.