from Hacker News

Ask HN: SVG Resolution

by parisianka on 3/26/21, 8:42 AM with 2 comments

Hello. I use .svg images only for the web. In my software (Affinity Designer), while creating an image, I'm always asked to choose the file resolution, for example, DPI 300 or DPI 72.

The question: Why, if SVG format is scalable vector and does NOT depend on the resolution? What DPI I should choose for web use?

Thank you for the precious help!

  • by compressedgas on 3/26/21, 9:25 AM

    When exporting to a raster, the product of the inch dimensions and the DPI specifies the raster's pixel dimensions.

    It is this pixel dimensions that matters on the web as it sets the size.

    Some prefer to leave this out of the SVG and size them with CSS where there are richer options for dynamic sizing.

    I recommend setting a good default size and then overriding it using CSS.

    I have seen too many SVG that due to the lack of sizing constraints that would have been imposed by their container end up as wide as the screen and equally tall.