SVG Vectorial Graphics: Illustrate and Animate with Code

Overview

“The viewbox attribute is a very interesting tool in SVG, because it allows us to create a virtual window in which our graphic will be rendered. In this way, we can use it to delimit the visible part of the graph, zoom in and define other behaviors. Let's see it in detail.”

In this video lesson Javier Usobiaga Ferrer addresses the topic: The viewbox attribute, which is part of the Domestika online course: SVG Vectorial Graphics: Illustrate and Animate with Code. Learn to create vector illustrations for your website, from basic lines to interactive animations.

Partial transcription of the video

“The ViewBox attribute is a very interesting element in SVG because it allows us to define the visible rectangle of an SVG graphic. Thus we can use this attribute to zoom into specific areas of the graphic or ensure it is viewed in full. let's see how it works So far. we’ve seen that the size of an SVG is set with Width and Height attributes. And this is what we call the viewport. but another attribute we can add is the ViewBox. which declares the visible area of this SVG. to explain what we mean by the visible area. let's imagine An SVG in this case is represented by this rectangle. We coul...”

This transcript is automatically generated, so it may contain mistakes.

Course summary for: SVG Vectorial Graphics: Illustrate and Animate with Code

• Level: Beginner
• 98% positive reviews (273)
• 9308 students
• 7 units
• 32 lessons (2h 2m)
• 6 downloads

• Category

  Web & App Design

• Software

  Adobe Illustrator, Sketch

• Areas

  Animation, Interactive Design, Web Design, Web Development