SVG and HTML

Previous Next

Home >> SVG >> SVG Tutorials >> SVG and HTML

SVG & HTML

We can easily embed SVG elements into HTML pages by using SVG tag. This is also called SVG embedding into HTML.

The SVG image begins with a < svg > tag
The width and height attributes of the < svg > element define the width and height of the SVG image
The < circle > element is used to draw a circle
The cx and cy attributes define the x and y coordinates of the center of the circle. The r attribute defines the radius of the circle.
The stroke and stroke-width attributes control how the outline/border of a shape appears.
The fill attribute tells us which color to fill inside the circle.
The closing < /svg > tag closes the SVG image

SVG Intro SVG & HTML SVG Circle SVG Rectangle SVG Eclipse SVG Line SVG Polygon SVG Polyline SVG Path SVG Text SVG Stroke SVG Blur Filter SVG Drop Shadow Filter SVG Linear Gradient SVG Radial Gradients in HTML

SVG Tutorials

Previous Next