• SVG- Scalar Vector Graphics.
  • It is a popular tool for displaying two-dimensional charts, graphics and illustrations on websites.
  • Without losing any of its resolution it can be scaled up or down.
  • It can be animated in every element and attribute.
  • SVG images are stored in XML text files and defined in a Vector graphics.
  • SVG files can be compressed, scripted, indexed, and searched and  scaled in size without loss of quality.
  • They are rendered by most used web browsers and Then the XML text files can be created and edited with vector graphics editors or  text editors.
  • At any resolution SVG images can be printed with high quality.
  • If they are zoomed or resized SVG graphics do NOT lose any quality.

Syntax:

<!DOCTYPE html>
<html>
   <body>
      <h1>My first SVG</h1>
      <svg width="100" height="100">
         <circle cx="50" cy="50" r="40" stroke="blue" stroke-width="4" fill="pink" />
         Sorry, your browser does not support inline SVG.
      </svg>
   </body>
</html>

 

Output:

Categorized in:

Web Designing

Tagged in:

, , , , , , , , , , , ,