: SVG and viewBox values I'm just curious if anybody knows how viewBox values (i.e. viewBox="a b c d") are determined. I'm trying to understand Inkscape's SVG functionality, so what I've done is

@Phylliss782

Inkscape uses mm as the default display-unit or user-unit for your document. User-units are used to store values in the SVG file.

<svg width="100" height="100" viewBox="0 0 26.458333 26.458333">


This tag describes a drawing size of 100px x 100px. The viewBox attribute defines that 100px x 100px is equivalent to 26.458333 x 26.458333 user units.

The SVG scale factor would be 1px / 0.2645 user-unit, which can be used by a SVG renderer to convert all the values that are stored in user-units to the real-world drawing dimensions.



In this case Inkscape wants to store the values in mm, so it has to know how px relates to mm. The CSS specification describes that absolute length units are fixed in relation to each other: 96px = 1in

This means 100px = 1.041666667in = 2.645833333cm = 26.45833333mm

So that's where the 26.45833333 comes from.



If you want Inkscape to store all your values in px, you can change the default Display units or user-units to px in the document properties (File > Document Properties > Tab: Page > General > Display Units)


Default, mm:





Changed: px:




Exporting the same document will result in the following SVG tag:

<svg width="100" height="100" viewBox="0 0 100 100">


Now the SVG scale factor is 1px / 1 user-unit.

If you want to know more about this subject, there is a more detailed explanation in the Inkscape Wiki

Remarks:


Inkscape v0.92 uses a relation of 96px/in, Inkscape v0.91 and earlier used a value of 90px/in

Vote Up Vote Down