A Simple SVG Example

Jakob Jenkov
Last update: 2014-06-15

SVG images can be very simple, or very complex. Here is a simple example:

<svg  xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink">
    <rect x="10" y="10" height="100" width="100"
          style="stroke:#ff0000; fill: #0000ff"/>
</svg>

As you can see this example is plain XML.

The example shows a simple rectangle with a width of 100 pixels and a height of 100 pixels. The stroke color (the rectangle outline) is set to the HTML color #ff0000. The fill color is set to #0000ff.

The resulting SVG image is shown below:

Jakob Jenkov

Featured Videos

P2P Networks Introduction




















Advertisements

High-Performance
Java Persistence
Close TOC
All Tutorial Trails
All Trails
Table of contents (TOC) for this tutorial trail
Trail TOC
Table of contents (TOC) for this tutorial
Page TOC
Previous tutorial in this tutorial trail
Previous
Next tutorial in this tutorial trail
Next