Follow

Hey folks, a ...

I have an SVG that I want to export into a PNG for use as an icon, which means the image must be square. But the aspect ratio of the original SVG is not.

How can I export the SVG to a square image without stretching it, or else how can I get inkscape (or some other tool) to draw the void space around it?

I'd like to avoid using PIL just for this but will if necessary.

· · Web · 4 · 0 · 1

@emacsen At the top of the PNG export dialog, you can set custom coordinates (x0, x1, y0, y1) to use as the bounding box of the resulting image.

If you don't want to manually calculate the right values, export as-is, load it up in GIMP and resize the canvas (Image -> Canvas Size), there you can just input the final width/height you want and press a button to center the content.

@phryk

Thank you!

Is there a command line option for either of these?

@emacsen I ended up needed to do the samething with my kids project. What I did is crop the image. Also image-magic is amazing that manipulating images. `convert -background none -size 1024x1024 infile.svg outfile.png`

Using inkscape via cli - `inkscape -z -e out.png -w 1000 -h 1000 in.svg`

stackoverflow.com/questions/98

@nixfreak

Sadly those aren't working for me :(

convert, even specifying 512x512, gives me:

outfile.png: PNG image data, 343 x 464, 8-bit/color RGBA, non-interlaced

Sadly the inkscape cli didnt work at all, other than removing the -z and -e, which is what I got from the beginning.

@nixfreak

I got it!

It took a little wrangling but!

(formatted nicely for readability)

convert -background none \
-resize 180x180 \
-gravity center \
-extent 180x180 \
infile.svg outfile.png

@emacsen @nixfreak Be careful with librsvg conversions. The support is good, but things like mesh gradients, text and a few other things might cause issues.

@federicomena @emacsen @nixfreak

I wouldn't put too much stock in the SVG2 W3C process, it's deader than a dead thing. But Inkscape isn't going to remove mesh gradient support on Mozilla and Google's say so.

What we know is that Inkscape artists use mesh gradients. Sometimes people want them to be rendered when making png files. Doing so requires mesh gradient support.

@doctormo I was looking at Inkscape's implementation, and the cairo work is pretty small.

Do you know if something other than Inkscape implements mesh gradients? I'm inclined to supporting them in librsvg, for the sake of compat with Inkscape, but it would be good to know.

@emacsen It's been a while since I've used inkscape, so it may have changed, but the export screen used to have a selector for export "page" vs export "drawing". So you'd set the page dimensions to 64x64 or whatever, and then position the drawing within that.

@elplatt

Thanks. I got what I need now from ImageMagic but I'll keep that in mind.

@hakimian45

Inkscape is the best FLOSS vector graphics program out there, other than maybe Krita, but then again I'm not David Revoy :)

Sign in to participate in the conversation
Mastodon

The social network of the future: No ads, no corporate surveillance, ethical design, and decentralization! Own your data with Mastodon!