Have you ever zoomed in a photo too much and saw that it was pixelated? Images taken with a digital camera can only be displayed at a specific resolution. You can reduce their size, but increasing them can be difficult – you lose quality in the process. These images (bitmap) are ideal for selfies, but size must be taken into account when creating them.
For scalable images, you’ll want to use a vector image, but what is a vector image? Logos, print designs and more – they often lack size. Vector images give you the ability to scale such images up (or down) without losing quality. Here’s everything you need to know about vector images, including how to create your own.
What is a vector image?
A vector image is similar to a map – scalable, with the distances between points A and B remaining proportional even if the overall image is enlarged.
Vector images are essentially digital instructions on how an editor or viewer should create an image. This allows your device to create an image with crisp curves and lines without blurring, pixelating or degrading image quality.
Instead of the static, inflexible pixel grid that you see when you zoom in on a bitmap file such as a JPG or BMP, vector images are created digitally using predefined mathematical instructions. Thanks to the magic of mathematics, the same point between A and B in a vector image will remain proportional.
If you are a graphic designer, you will immediately understand the advantages that vector images offer you over raster images. Instead of worrying about image resolution before starting work, you can create an image of any size.
After that, everything is decided on the scale – vector images in formats such as SVG can be made arbitrarily small or large. This is why vector image formats are usually best suited for art and design projects, especially if you are creating a logo or design that you want to print.
How to display vector images
Vector images are not an unusual image format. You should be able to open them in your browser or with vector drawing software such as Inkscape Vector images also open in standard image editors such as Photoshop or special image editors such as Illustrator.
However, for most users, the easiest way is to use your browser. Most major web browsers support vector graphics. For example, to open a vector image in Google Chrome, click File> Open File and select the vector image file. If it’s in a standard format like SVG, Chrome should render the image and allow it to be viewed.
SVG images can also be opened in text editors such as Notepad ++, since SVG files are just strings of XML code. You can edit your vector art this way if you like. The image is then created on the fly using the design specified in the file. The process is the same whether you view it in a browser or in an image editor.
However, other image file formats may work differently. Some document formats, such as PDF, are considered vector images, but can be created to contain other types of content, including bitmaps. They can also be opened in your web browser, but a dedicated PDF reader may be required instead.
Create and edit vector images in Inkscape
If you want to create or edit a vector image, you need a suitable vector image editor. As we mentioned, you can manually edit the SVG image file using a text editor, but this is impractical for most users.
Vector image editors exist on all major platforms. Two of them are considered the most famous – Inkscape and Adobe Illustrator. Inkscape is the best option for beginners and hobbyists alike. It is a free open source vector image editor available for Windows, Linux and macOS users.
- To create a vector image in Inkscape, all you have to do is create a new file – SVG files are the default Inkscape file format. A new canvas will be created when you open Inkscape, but click File> New to manually create a new canvas.
- To open the image file in Inkscape, click File> Open.
- You can also create vector images by taking an existing bitmap and tracing it to create a corresponding vector image in its place. To do this, click Path> Trace Bitmap.
- Select a luminance cutoff setting here – you’ll need to adjust the threshold to see how well this works, but 0.500-1,000 is a good place to start. Click “Refresh” to see a preview.
- Inkscape can perform multiple scans to try and make the final vector image as accurate as possible. Set the number of scans in the field and section “Scan”, then click “OK” to start the process.
While Inkscape is a great free option for most users looking to create vector images, there are alternatives that you should definitely consider.
One of the largest is Adobe Illustrator, a professional vector graphic design tool that meets industry standards. This requires a paid Adobe Creative Cloud subscription and is only available on Windows and macOS.
You can download a less powerful version of Illustrator for iPhone and iPad, but it won’t include some of the advanced features available for desktop users.
You can also edit or create new vector images online with services like Vectr, which offers a free online vector image editor. It’s not as powerful as Inkscape or Illustrator, but it can help you create new, original designs quickly.
There are other alternatives to Inkscape For macOS users, Sketch is a good option, especially for UI designers. Sketch uses its own proprietary file format, but it is supported by Inkscape and Adobe Illustrator. Sketch is not free, but you can try it with a 30-day free trial.
Using Image Editing Software
With free image editing software, creating high quality images on any platform has never been easier. If you are a mobile user, photo editing apps can turn your basic shots into high quality content suitable for your social media pages.
If you’re interested in design, you’ll need a high quality vector image editor. You don’t need to spend a single dollar to do this – Inkscape is open source and available for free on all platforms, including macOS. If you want to edit bitmaps on Mac, you’ll need a free Mac image editor like Pixelmator or GIMP.