How to Tell If an SVG Contains a Raster Image

Yes, an SVG can contain a raster image. It can hold vector paths and pixels in the same document, or it can be little more than a wrapper around a PNG or JPEG. The .svg extension tells you the container format, not whether every visible part is vector.

The reliable check is to inspect both the objects and the file source. Zooming helps you notice a problem, but it cannot tell you whether an app is rasterizing its preview or the pixels are actually stored in the SVG.

What an SVG can contain

SVG is an XML-based graphics format, and its content model is broader than paths alone. The SVG 2 embedded-content specification defines an <image> element that places a complete referenced file inside a rectangle. That file can be a PNG, a JPEG, or another SVG.

This creates four common structures:

Mixed content is not automatically wrong. A map may use paths for labels and boundaries while keeping a shaded satellite layer raster. A product graphic may place an editable badge over a photograph. The problem begins when you expected a conversion to produce editable paths and received pixels in a different container.

Check 1: inspect the objects

Open the SVG in Illustrator, Inkscape, Affinity Designer, or another editor with an Objects or Layers panel. Select the area you suspect is raster.

• A single rectangular object labeled as an image is strong evidence of image content.
• Visible nodes along the artwork's actual edges indicate vector geometry.
• A clipping path may hide a rectangular image, so expand the layer or object tree before deciding.
• Paths elsewhere do not prove the whole document is vector. One file can contain both.

This check is useful for designers who do not want to read XML, but it has one limit: a rectangular <image> object can reference another SVG. The source check tells you what the object actually loads.

Check 2: inspect the SVG source

Make a copy, then open the .svg file in a plain-text editor. Search for <image. If there is no image element, the common embedded-image mechanism is absent. If you find one, read its href value.

An embedded PNG often begins like this:

<image href="data:image/png;base64,iVBORw0KGgo..." />

An embedded JPEG typically begins with data:image/jpeg;base64,. MDN's data-URL reference explains that the data is placed directly in the URL, with optional Base64 encoding. A very long unreadable payload is normal for this form.

A linked raster looks more like this:

<image href="photos/product-shot.png" />

That PNG is not stored inside the SVG. The document depends on a separate file at that path. Move or email the SVG without the image and the artwork may disappear.

Finally, this is not proof of raster content:

<image href="icons/mark.svg" />

The <image> reference on MDN explicitly notes that the element can display raster formats or another SVG. Check the media type or file extension before classifying it.

Three structures inside or beside an SVG

Embedded and linked are different problems

When importing a picture, Inkscape can link it or embed it. Its picture-import guide describes the tradeoff plainly: linking keeps the SVG smaller but makes the document depend on the picture's location; embedding makes the SVG self-contained but increases its size.

That difference matters at handoff:

• Embedded raster: portable as one file, but still resolution-bound and often much larger than expected.
• Linked raster: easier to update independently, but fragile when moved between folders, computers, websites, or vendors.
• Vector paths: editable as geometry, but only if the source was traced or drawn as paths in the first place.

Embedding is packaging, not vectorization. Base64 does not turn pixels into curves.

Why zooming is not enough

If the suspicious region becomes blocky at high zoom in several viewers, it is probably raster. Still, a viewer may rasterize an otherwise healthy SVG for a thumbnail, canvas, print preview, or import cache. Conversely, a high-resolution embedded PNG can look smooth at ordinary zoom and hide inside the document unnoticed.

Use zoom as a symptom check, then confirm with objects or source. The broader guide to why an SVG looks pixelated separates embedded content from viewer behavior and small-icon rendering.

Decide whether to keep, relink, or replace it

Keep the raster when pixels are intentional

Photographs, scans, texture, soft lighting, and complex painted detail often belong in raster form. If the SVG exists to combine that image with vector labels or overlays, a mixed file may be the correct design. Confirm that the raster has enough resolution at the final physical size and decide whether the delivery should be self-contained or packaged with linked assets.

Relink or embed when portability is the issue

If a linked image disappears on another computer, either package the SVG and its image with the same relative folder structure or embed the image before delivery. This fixes the missing resource. It does not make the image editable as paths.

Replace the raster when paths were promised

If a converter wrapped a flat logo, icon, or line drawing in an SVG, find the original PNG or JPEG. If the original is unavailable, extract the embedded image or export that object at its native size. Then convert the image into vector paths, inspect the shapes, and replace the <image> object with the verified vector result.

PerfectVector is useful for reconstructing suitable flat artwork as editable shapes. It does not make continuous-tone photography magically become a small, faithful set of paths. For a photo, keep the raster unless a deliberately posterized interpretation is the goal.

Rebuild effects that were rasterized on export

Some SVGs are mostly vector but contain one rasterized shadow, blur, texture, or unsupported effect. Decide whether the effect needs to stay editable and portable. Rebuild a simple effect with supported vector features, flatten it intentionally as a raster at delivery resolution, or remove it. Tracing a soft shadow usually creates noisy shapes rather than a better effect.

A delivery audit for mixed SVGs

Before sending the file to a website, printer, cutter, or collaborator:

1. Search the source for <image, data:image/, .png, .jpg, and .jpeg.
2. Confirm whether every referenced resource should be raster, vector, or absent.
3. Temporarily move linked files and reopen the SVG to expose broken dependencies.
4. Select the important artwork and verify that the parts meant to be editable are paths.
5. Check the raster's native pixel dimensions against its final display or print size.
6. Reopen the delivered copy in a second application.
7. Keep the original source and a raster proof when appearance matters more than editability.

For cutting or fabrication, remove decorative raster content from the machine file and run the SVG preflight for cutting. A cutter follows paths; it does not turn an embedded photograph into a cut contour.

FAQ

Can an SVG contain a PNG or JPEG? Yes. An SVG image element can reference a PNG or JPEG as a separate file or carry its data inside the SVG. The raster keeps its original pixel-based behavior.

Does an image tag always mean the SVG contains a raster image? No. The image element can also reference another SVG. Inspect its href or older xlink:href value for the media type, data URL, or filename before classifying it.

How do I know whether the raster is embedded or linked? An embedded image usually has an href beginning with data:image, so its bytes live inside the SVG. A linked image has a path or URL such as images/photo.png and depends on that separate resource.

Can I remove an embedded image from an SVG? Yes. Delete it if it is unnecessary, replace it with an intentional raster asset, or vectorize suitable flat artwork and substitute the resulting paths. Keep a backup before editing the XML.

Why does my SVG contain paths and an image? It is a mixed SVG. The file may intentionally combine a photo with vector overlays, or an exporter may have rasterized an effect. Inspect which parts need editability before changing it.

Sources

1. W3C — SVG 2 Embedded Content — Defines the <image> element, its href, and the raster or SVG resources it can reference.
2. MDN — SVG <image> — Practical reference for supported image content and sizing behavior.
3. Inkscape Beginners' Guide — Importing Pictures — Explains linked versus embedded imported pictures and the portability tradeoff.
4. MDN — Data URLs — Documents the data: scheme commonly used to store image payloads inside an SVG.

Found a wrapped bitmap where editable paths should be? Convert the original flat artwork into a real vector, reopen the SVG, and verify that the important objects now select as shapes.