Scaling SVG produced with inkscape

Question

I am trying to resize this SVG file produced using inkscape

I have tried using viewBox="0 0 h w" attribute within the <svg/> but it crops the image instead of resizing. Thanks in anticipation

Answer 1

Inkscape doesn't add a viewBox attribute to the files it produces. That attribute is needed for scaling to work.

The solution is to convert the width and height values to a viewBox and then alter your width and height.

So add the following to your root <svg> tag:

viewBox="0 0 205 69"

Then change your width/height. If you want double size, you could do:

width="410" height="138"

Or if you want it to fill the page or it's parent container you could do:

width="100%" height="100%"

<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   viewBox="0 0 205 69"
   width="100%"
   height="100%"
   id="svg2985"
   version="1.1"
   inkscape:version="0.48.4 r9939"
   sodipodi:docname="official.svg">
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="1.88"
     inkscape:cx="268.4359"
     inkscape:cy="163.44054"
     inkscape:current-layer="layer1"
     inkscape:document-units="px"
     showgrid="false"
     inkscape:window-width="1301"
     inkscape:window-height="744"
     inkscape:window-x="65"
     inkscape:window-y="24"
     inkscape:window-maximized="1">
    <sodipodi:guide
       id="guide3594"
       position="0,370.82039325"
       orientation="0,800.0" />
    <sodipodi:guide
       id="guide3596"
       position="0,229.17960675"
       orientation="0,800.0" />
    <sodipodi:guide
       id="guide3598"
       position="494.427191,0"
       orientation="600.0,0" />
    <sodipodi:guide
       id="guide3600"
       position="305.572809,0"
       orientation="600.0,0" />
    <sodipodi:guide
       id="guide3602"
       position="0,600.0"
       orientation="0,800.0" />
    <sodipodi:guide
       id="guide3604"
       position="600.0,0"
       orientation="0,800.0" />
    <sodipodi:guide
       id="guide3606"
       position="0,800.0"
       orientation="600.0,0" />
    <sodipodi:guide
       id="guide3608"
       position="800.0,0"
       orientation="600.0,0" />
  </sodipodi:namedview>
  <defs
     id="defs2987" />
  <metadata
     id="metadata2990">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
        <dc:title></dc:title>
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     id="layer1"
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     transform="translate(0,-531)">
    <path
       sodipodi:type="star"
       style="fill:#008080;fill-opacity:1;fill-rule:evenodd;stroke:#008080;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
       id="path3003"
       sodipodi:sides="3"
       sodipodi:cx="208.33333"
       sodipodi:cy="448.33334"
       sodipodi:r1="329.16138"
       sodipodi:r2="164.5807"
       sodipodi:arg1="0.57255439"
       sodipodi:arg2="1.6197519"
       inkscape:flatsided="true"
       inkscape:rounded="0.15947024"
       inkscape:randomized="0"
       d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
       inkscape:transform-center-x="-8.8816078"
       inkscape:transform-center-y="-0.012778438"
       transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,212.00937,543.99054)" />
    <path
       sodipodi:type="star"
       style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
       id="path3003-6"
       sodipodi:sides="3"
       sodipodi:cx="208.33333"
       sodipodi:cy="448.33334"
       sodipodi:r1="329.16138"
       sodipodi:r2="164.5807"
       sodipodi:arg1="0.57255439"
       sodipodi:arg2="1.6197519"
       inkscape:flatsided="true"
       inkscape:rounded="0.15947024"
       inkscape:randomized="0"
       d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
       inkscape:transform-center-x="-8.8816118"
       inkscape:transform-center-y="-0.012779205"
       transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,213.12005,546.20636)" />
    <text
       xml:space="preserve"
       style="font-size:16.25434494px;font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#576a6c;fill-opacity:1;stroke:none;font-family:Century Schoolbook L;-inkscape-font-specification:Century Schoolbook L Medium"
       x="2.427422"
       y="563.2641"
       id="text3791"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan3793"
         x="2.427422"
         y="563.2641"
         style="font-size:36.57227707px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;word-spacing:0px;fill:#576a6c;fill-opacity:1;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">Akogun</tspan></text>
    <text
       xml:space="preserve"
       style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       x="186.45212"
       y="409.6254"
       id="text5280"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan5282"
         x="186.45212"
         y="409.6254" /></text>
    <text
       xml:space="preserve"
       style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#008080;fill-opacity:0.50196078;stroke:none;font-family:Sans"
       x="49.39143"
       y="567.16937"
       id="text5284"
       sodipodi:linespacing="125%"><tspan
         sodipodi:role="line"
         id="tspan5286"
         x="49.39143"
         y="567.16937" /><tspan
         sodipodi:role="line"
         id="tspan5288"
         x="49.39143"
         y="584.67633"
         style="font-size:13.20665646px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;fill:#008080;fill-opacity:0.50196078;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">P o l y m a t h</tspan></text>
    <path
       sodipodi:type="star"
       style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
       id="path3003-6-5"
       sodipodi:sides="3"
       sodipodi:cx="208.33333"
       sodipodi:cy="448.33334"
       sodipodi:r1="329.16138"
       sodipodi:r2="164.5807"
       sodipodi:arg1="0.57255439"
       sodipodi:arg2="1.6197519"
       inkscape:flatsided="true"
       inkscape:rounded="0.15947024"
       inkscape:randomized="0"
       d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
       inkscape:transform-center-x="-8.8816136"
       inkscape:transform-center-y="-0.012761026"
       transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,214.3031,538.55495)" />
    <flowRoot
       xml:space="preserve"
       id="flowRoot3053"
       style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
         id="flowRegion3055"><rect
           id="rect3057"
           width="598"
           height="182"
           x="102"
           y="144" /></flowRegion><flowPara
         id="flowPara3059" /></flowRoot>    <flowRoot
       style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
       id="flowRoot3296"
       xml:space="preserve"
       transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
         id="flowRegion3298"><rect
           y="164"
           x="30"
           height="218"
           width="502"
           id="rect3300" /></flowRegion><flowPara
         id="flowPara3302" /></flowRoot>  </g>
</svg>

Answer 2

The svg/@viewBox attribute controls the range of coordinates which are shown within the viewport ( the area of the screen the svg takes up ).

The size of the viewport is determined mostly by the svg/@width and svg/@height attributes - see https://www.w3.org/TR/SVG/coords.html

The ‘width’ attribute on the outermost svg element establishes the viewport's width [...], if there are positioning properties specified on the referencing element or on the outermost svg element that are sufficient to establish the height of the viewport, then these positioning properties establish the viewport's height; otherwise, the ‘height’ attribute on the outermost svg element establishes the viewport's height.