CodePen Embed - SVG viewBox


<p>3.</p>
<svg width="50" height="50" viewBox="0 0 50 50">
  <ellipse cx="50" cy="50" rx="50" ry="50"></ellipse>
</svg>

<p>4.</p>
<svg width="50" height="50" viewBox="0 0 100 100">
  <ellipse cx="50" cy="50" rx="50" ry="50"></ellipse>
</svg>

<p>5.</p>
<svg width="50" height="50" viewBox="0 0 25 25">
  <ellipse cx="50" cy="50" rx="50" ry="50"></ellipse>
</svg>

body {
  font: 18px/1.6 'Roboto', sans-serif;
  background: #f2f2f2;
  color: #3a3a3a;
  padding: 20px 40px;
}
svg {
  fill: #49b293;
}

This Pen is owned by Envato Tuts+ on CodePen. It is a fork of this Pen.

See more by @tutsplus on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.