SVG Basics

About this Course

Scalable Vector Graphics (SVG) is an XML markup language for creating two-dimensional images using vectors. This is different from traditional raster-based image formats that use pixels, like JPEG and PNG. When used on web pages, SVG images provide an infinite level of detail, so they look sharp regardless of screen size or pixel density. In this course, we'll look at situations where SVGs are better than PNG and JPEG files, as well as when an SVG might not be the best choice. Finally, we'll learn how to modify SVGs using CSS.

What you'll learn

• Vector graphics versus raster graphics
• Image and background SVGs
• Embedded SVGs
• Responsive SVGs

Teacher

• Nick Pettit

  Nick is a teacher and an independent game developer.

Download videos

You need to sign up for Treehouse in order to download course videos.