HTML Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>SVG Ellipse — styles</title>
</head>
<body>
  <h1>SVG &lt;ellipse&gt; — dashed &amp; opacity</h1>
  <svg width="240" height="100" role="img" aria-label="Semi-transparent and dashed ellipses">
    <ellipse cx="70" cy="50" rx="55" ry="30" fill="#ef4444" fill-opacity="0.35" stroke="#991b1b" stroke-width="2" />
    <ellipse cx="175" cy="50" rx="55" ry="30" fill="none" stroke="#6d28d9" stroke-width="3" stroke-dasharray="6 4" />
  </svg>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

SVG Ellipse — dashed border and opacity (Try It)