SVG Vectorial Graphics: Illustrate and Animate with Code

Overview

“The SVG code can receive styles through the attributes or through CSS. In this lesson we will see how to use them in each case, and what new CSS properties we can use with the SVG tags.”

In this video lesson Javier Usobiaga Ferrer addresses the topic: Styles in SVG, 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

“[Instrumental] In the Super-G we can apply styles through attributes, but we can also do it through of CCS, let's see how it works. We have seen that the property Fill serves to indicate the fill, of an SVG element, of the same way that it serves backgrounf color, in the HTML elements. Now let's see new properties, like for example ... Stroke that indicates the edge of an SVG element or so to speak, the path. Stroke. Specifically indicate the color of this edge, and stroke width, would indicate the width of this edge. We go back to the code editor, and this rectangle that we see here, I'm g...”

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 (271)
• 9108 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