SVG to JPG Converter

This SVG to JPG converter turns vector SVG files into JPG images at the resolution you choose, inside your browser. It is for anyone who needs a raster version of a logo, icon or illustration — for a website, a document, an avatar or software that does not accept SVG — and wants it sharp rather than stretched.

An SVG is resolution-independent: it describes shapes, so it has no fixed pixel size of its own. The JPG, by contrast, is a fixed grid of pixels of exactly the size you ask for, and once it is made it cannot be enlarged without going soft. That is the trade you are making, and it is why the size choice matters. A larger size gives a sharper JPG and a larger file; a smaller size is lighter but has fewer pixels to show fine detail.

To decide the size, the tool reads the root <svg> element. If width and height are both set, those are used, with units converted to CSS pixels (1in = 96px, 1cm ≈ 37.8px, 1pt ≈ 1.33px, 1em counted as 16px). If only one is set and there is a viewBox, the other follows the viewBox's aspect ratio. If they are missing or percentages, the viewBox width and height are used. If there is nothing at all, the SVG is treated as 300 × 150 — the default size browsers give any replaced element with no intrinsic size — and the result says so, because anything drawn outside that area is cut off.

You then pick the output size: 1× (the SVG's own size), 2×, 4×, or a custom width in pixels with the height following the aspect ratio. Instead of rendering the SVG at its own size and stretching the pixels — which is why many converters give soft results — the tool rewrites the SVG's width and height to the target size (adding a viewBox if the file has none, so the drawing scales with it) and lets the browser rasterise the vector directly at that resolution. A 24 × 24 icon at 4× is drawn as a crisp 96 × 96 image.

Two things are specific to JPG. First, it is lossy: the encoder discards fine detail to shrink the file, and the Quality slider (92 out of 100 by default, where the loss is very hard to see) controls how much. Second, JPG has no transparency, so anywhere the SVG is see-through becomes the Background colour — white by default — or the colour you pick. This is exactly right for a logo on a white page, and wrong if you need the cut-out shape to stay transparent: in that case use SVG to PNG.

The SVG is rendered the way browsers render any SVG used as an image: scripts inside it do not run, and external resources are not loaded. That second point is the most common surprise. An SVG that uses a web font from Google Fonts, or links to a picture by URL, will come out with fallback text and a missing picture. The tool checks for links that point at an absolute or protocol-relative URL and warns you about those; a relative reference may not be caught. The fix is to embed fonts and images in the SVG (as data: URLs) or convert text to paths in your editor. Text may also render differently simply because the font named in the SVG is not installed on your device, in which case the browser substitutes one.

The output can be up to 16,384 px on a side and 100 megapixels. Everything happens on your device — the file is read, drawn and encoded in the page, and you can confirm in your browser's developer tools (Network tab) that no request carries it.

1. The file's first bytes are checked to confirm it is an SVG (an <svg> root element), whatever its name. 2. The root element's width, height and viewBox are read. Size = width × height if both are usable; one side plus viewBox → the other side from the viewBox ratio; neither → viewBox size; nothing → 300 × 150. 3. Output width = chosen width, or natural width × scale (rounded); output height = output width × natural height ÷ natural width, rounded, minimum 1 px. The size must fit within 16,384 px per side and 100 megapixels. 4. The root element's width and height are replaced with the output size; if there is no viewBox, one is added from the natural size so the content scales. 5. The browser draws the rewritten SVG as an image onto a canvas of exactly that size, after filling the canvas with the Background colour — JPG has no alpha channel, so transparency must become a solid colour (white by default). 6. The canvas is encoded as JPEG at the chosen quality (1–100, default 92) and named after the original with a .jpg extension.