Experiments
Load an example and 'view the source code' to see what's going on under the hood.Basic Stuff
Some simple, introductory examples of SVG.SVG Shape Elements
Presentation Attributes & CSS
Strokes & Fills
Other SVG Elements
SVG in HTML
More Complex Stuff
Filters, scripting, animation, and other [more] complicated examples.Masking & Clipping
Filters
JavaScript
General JS
Using jQuery
- Create SVG with JavaScript (Generate SVG <text> Element)
- Button Test/Mouse Events (Testing Various Methods to Build Buttons)
Using jQuery
Animation
Declarative animation with SMIL using <animate> and related elements (Not supported in IE9)
- Animate XML Attributes
- Animate CSS Attributes
- Animate XML/CSS Attributes (Animating multiple attributes and shapes)
- Synchronized Animation (Synchronizing the motion of two shapes)
- Repeating Animation (Repeating motion n times)
- Repeating Indefinitely (Creating a constant animation loop)
- Break the Indefinite Loop (Canceling a constant animation loop)