HTML Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>SVG Example</title>
  <style>
    .rect-style {
      fill: lightblue;
      stroke: black;
      stroke-width: 2;
    }
    .circle-style {
      fill: tomato;
      stroke: black;
      stroke-width: 2;
    }
  </style>
</head>
<body>
  <h1>SVG Example</h1>
  <svg width="220" height="200" xmlns="http://www.w3.org/2000/svg">
    <title>Sample shapes</title>
    <desc>A rectangle, circle, and green curve.</desc>
    <rect x="10" y="10" width="100" height="100" class="rect-style"/>
    <circle cx="170" cy="60" r="40" class="circle-style"/>
    <path d="M10 170 Q 60 140, 110 170 T 210 170"
          fill="none" stroke="green" stroke-width="4"/>
  </svg>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

HTML SVG — Complete Example Page