Skip to main content
katielady1
Inspiring
October 16, 2026
Answered

Creating 20 px rounded corner

Hi,

I’m creating a print document for an organization and their brand guide is based on their website. The brand guide specifies their boxes have rounded corners with an outer radius of 20px.  I went into preferences and changed my horizontal and vertical ruler to use pixels. However if I set the rounded corners on my box to 20px, it looks much more rounded than what I see on the website. Is it something to do with pixel per inch ratio of print vs web? How should I adjust it?

 

thanks! 

    CORCTON34033231
    CORCTON34033231Correct answer
    Community Expert
    October 16, 2026

    Hi, yes — that's exactly it: a pixel isn't the same physical size in the two places.

     

    In InDesign, the pixel unit equals a point: 1 px = 1 pt = 1/72 inch. On the web, a CSS pixel is defined as 1/96 inch. So entering 20 px in InDesign gives you 20/72 inch (about 7.1 mm), while 20 CSS px on the website is 20/96 inch (about 5.3 mm) — roughly a third larger, which is why it looks much rounder.

     

    To match the printed size of the website's 20 px radius, use 20 × 72 ÷ 96 = 15 pt. You don't need to change your rulers for this: select the frame, go to Object > Corner Options (or use the corner radius field in the Control panel), and simply type 15 pt — InDesign accepts the value with its unit and converts it for you.

     

    I'd also judge it from a printout at 100% rather than on screen, since InDesign's 100% view may not be true physical size on your monitor. If the brand team can give you the radius in mm or pt, that's the safest spec for print.

     

    Hope that helps!

    View reply

    2 replies

    katielady1Author
    Inspiring
    October 16, 2026

    ​@CORCTON34033231 I really appreciate the reply. I also appreciate the formula to I can convert in a few other spots. 

    Translate
      CORCTON34033231
      Community Expert
      CORCTON34033231Community ExpertCorrect answer
      Community Expert
      October 16, 2026

      Hi, yes — that's exactly it: a pixel isn't the same physical size in the two places.

       

      In InDesign, the pixel unit equals a point: 1 px = 1 pt = 1/72 inch. On the web, a CSS pixel is defined as 1/96 inch. So entering 20 px in InDesign gives you 20/72 inch (about 7.1 mm), while 20 CSS px on the website is 20/96 inch (about 5.3 mm) — roughly a third larger, which is why it looks much rounder.

       

      To match the printed size of the website's 20 px radius, use 20 × 72 ÷ 96 = 15 pt. You don't need to change your rulers for this: select the frame, go to Object > Corner Options (or use the corner radius field in the Control panel), and simply type 15 pt — InDesign accepts the value with its unit and converts it for you.

       

      I'd also judge it from a printout at 100% rather than on screen, since InDesign's 100% view may not be true physical size on your monitor. If the brand team can give you the radius in mm or pt, that's the safest spec for print.

       

      Hope that helps!

      Translate
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices