05 Scalable Vector Graphics

Posted on: March 31, 2020 | Categories: Lesson | Tags: , ! Course:

In this lesson we explore the SVG format in all its glory.

Teacher Activities

Student Activities

  • Participate in class discussion
  • Read Adding vector graphics to the Web and take Outline Notes
  • Go to the Noun Project and download two SVGs images to add to your summer story narrative.
  • Open your summer story document in VS Code.
    1. Embed one of the SVG’s to your document using the <img> element.
    2. Embed the other SVG as inline code in your document.
    3. Show me your web page!*


Use a vector drawing tool to create your own SVG images (Adobe Illustrator or Sketch). Explore SVG animation techniques.

Leave a Reply

Your email address will not be published. Required fields are marked *