What Is an SVG File? (And How to Open, Use, and Make One)

An SVG (Scalable Vector Graphics) file is an image made of math and code instead of a grid of pixels. Because it stores a picture as shapes (lines, curves, and fills) rather than colored dots, it stays sharp at any size, from a tiny app icon to a full billboard, and the file is usually small. You've probably met SVGs as logos, website icons, and Cricut cut files.

This is a plain guide for anyone who just ran into one: what an SVG actually is, what's inside it, what it's good and bad at, how to open one, and how to make one from an image you already have. No web-development background needed.

The short version

• An SVG stores an image as shapes described in code, not pixels, so it scales to any size without going blurry.
• It's great for logos, icons, simple illustrations, and Cricut or print work. It's a poor fit for photos.
• Open one in any web browser, a design app (Illustrator, Inkscape, Figma, Canva), or even a plain text editor.
• Make one by designing it in vector software, or by converting an image you already have into an SVG.

SVG vs. a regular image (PNG or JPG)

A PNG or JPG is a raster image: a fixed grid of colored pixels, like a mosaic. Zoom in far enough and you see the squares, which is why a logo saved as a PNG goes blurry when you blow it up.

An SVG is a vector image: a set of instructions that says "draw a circle here, fill it orange, draw this curve there." Because the picture is redrawn from those instructions every time, it looks sharp at any size. That single difference is the whole appeal. (For a full breakdown of when to use each, see PNG vs SVG.)

What's actually inside an SVG file

Here's the part that surprises people: an SVG is text. Open one in Notepad or any code editor and you can read it. Under the hood it's XML, a tagged text format, where each shape is a line of code. A simple SVG of an orange circle looks like this:

<svg viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="orange" />
</svg>

That's the entire file. circle draws the shape, cx/cy place it, r sets the radius, and fill sets the color. Because it's plain text, an SVG is tiny, a browser can render it instantly, and you can tweak a color by changing one word. SVG is an open standard that the W3C has maintained since the late 1990s, and every modern browser supports it.

What SVGs are used for

SVGs shine anywhere a graphic needs to stay crisp at different sizes or be edited as shapes:

• Logos. One SVG works on a business card and a banner without a separate file for each size.
• Website icons and graphics. Buttons, arrows, and simple illustrations stay sharp on any screen and load fast.
• Cricut and cutting machines. SVG is the standard cut-file format. The machine follows the paths to cut vinyl, paper, or HTV. (Preparing SVG files for Cricut covers this end to end.)
• Print and signage. A vector scales to any physical size without pixelating.

What SVGs are not good for

SVGs are made for flat, graphic art, so they're a poor fit for photographs. A photo is millions of subtly blended colors with no flat regions, and forcing it into shapes gives you either a posterized, painting-like version or a huge, messy file. If you're tempted to vectorize a photo, read what actually happens when you convert a photo to SVG first. For real photographic detail, keep the JPG or PNG.

How to open an SVG file

You have three easy options, depending on what you want to do:

• Just look at it: drag the file into any web browser. It renders instantly, no software needed.
• Edit it visually: open it in a design app like Inkscape (free), Illustrator, Figma, or Canva. (How to edit an SVG walks through recoloring and reshaping.)
• See or tweak the code: open it in a plain text editor like Notepad or VS Code.

One thing that trips people up: Windows File Explorer doesn't show a thumbnail for SVGs by default, so the file looks blank in the folder. That doesn't mean it's broken. Open it in a browser and it'll appear fine.

How to make an SVG

There are two routes, and the right one depends on what you're starting from.

Design it from scratch. Draw your logo, icon, or illustration in vector software (Inkscape, Illustrator, Figma, or Canva) and export it as SVG. This gives you the cleanest result because the file was vector from the start.

Convert an image you already have. This is what most people actually need. If your logo or artwork only exists as a PNG or JPG, you turn it into an SVG by vectorizing it, which redraws the pixels as editable shapes. (What image vectorization is explains the process.)

What this looks like with PerfectVector

If you have a PNG or JPG and need a real SVG, that's the conversion route, and it's what PerfectVector does. Upload a logo, icon, or flat illustration and it rebuilds the artwork as a clean SVG with a low node count and editable colors, ready for the web, print, or a cutting machine. You can turn your image into an SVG and check the result yourself. Convert your first images free, no credit card required.

It works best on the same things SVG itself is good for: flat, graphic art and logos. For a detailed photo, no converter will give you a true photographic vector, and we'll tell you that rather than pretend otherwise.

A quick safety note

Because an SVG can contain code, it can in theory carry a script, the same way a web page can. Viewing one in a browser or a design app is safe, and SVGs from sources you trust are fine. Just treat a random SVG from an unknown source the way you'd treat any unknown file, and don't embed one on your website without knowing where it came from.

FAQ

What is an SVG file used for? Logos, website icons, buttons, simple illustrations, and cut files for machines like Cricut. Anywhere a graphic needs to stay sharp at different sizes or be edited as shapes, an SVG is a strong choice. It's used heavily on the web because the files are small and scale without losing quality.

How do I open an SVG file? Drag it into any web browser to view it, open it in a design app like Inkscape, Illustrator, Figma, or Canva to edit it visually, or open it in a text editor like Notepad to see the code. Note that Windows File Explorer doesn't show a thumbnail for SVGs by default, so a blank-looking icon doesn't mean the file is broken.

How do I create an SVG file? Either design it in vector software (Inkscape, Illustrator, Figma, or Canva) and export as SVG, or convert an image you already have, like a PNG or JPG logo, into an SVG by vectorizing it. Designing from scratch gives the cleanest result; converting is the quick route when you only have a raster file.

Is an SVG file a vector file? Yes. SVG stands for Scalable Vector Graphics, and it stores images as vector shapes rather than pixels. That's exactly why it scales to any size without losing quality.

What's the difference between an SVG and a PNG or JPG? A PNG or JPG is made of pixels and blurs when enlarged past its resolution. An SVG is made of shapes and stays sharp at any size. PNG and JPG are better for photos; SVG is better for logos, icons, and graphics.

Can I open an SVG file in Microsoft Word or Office? Yes. Microsoft 365 and recent versions of Office let you insert SVG files and even recolor or restyle them inside a document, which is handy for logos and icons in reports and slides.

---

An SVG is simply an image built from shapes and code instead of pixels, which is what lets it stay sharp everywhere and stay editable. If yours only exists as a PNG or JPG so far, convert it into a clean SVG and you'll have a file you can scale, recolor, and cut without it ever going blurry.