What Are Scalable Vector Graphics (SVG)?

Today, SVG has become an essential web design file format, passing more traditional formats such as JPG, PNG, and GIF.

But what is SVG? What do you do with them? Why do you use them?

SVG is often used to display a variety of graphics on the internet and other digital environments, such as tablet and mobile.

SVG Files

SVG stands for Scalable Vector Graphics. So simply put, SVG is a vector graphic format based on XML. Created in the late 1990’s, SVG wasn’t around very often due to web browser rendering requirements. Today, all modern web browsers have the power to display SVG files, making SVG unmatchable regarding responsiveness, scalability, ease of use, programmability, user experience, and accessibility.

What makes SVG so unique?

Technically, on the back end, SVG files are just plain text files that can describe lines, curves, shapes, and colours. The image data is stored as a geometric description, unlike JPGs or PNGs which use a description of each pixel. This simple data allows vector graphics to scale across platforms and sizes nicely.

What Are Scalable Vector Graphics (SVG)?

Tweet this

SVG code can also be manipulated using CSS or JavaScript which allows a vast amount of flexibility compared to traditional digital file formats. Currently, SVG responds to the demands of modern web design and development better than any other accessible format. SVG is perfect for designing elements that need to be able to keep up in the responsive environment of modern web browsers.

While SVG files are one of the most used file formats for vector graphics, they also have a weakness. SVG files are not good at handling photos. Due to the scalable nature of the geometric description, SVG needs to interpret the shape and fill with elements making it incapable of representing complex aspects usually found in photographs.

Harlen Malkowich
Aug 30, 2018
By

Get Email Updates (It's FREE)

Zero Spam. Unsubscribe Anytime. We respect your privacy!

Made With In Whistler