Essayez-le vous-même Exemples
Les exemples ci-dessous intègrent le code SVG directement dans le code HTML.
Ceci est soutenu par Firefox, Internet Explorer 9, Google Chrome, Opera et Safari.
SVG Exemples
SVG Basic Shapes
Un cercle
Un rectangle
Un rectangle avec une opacité
Un rectangle avec une opacité 2
Un rectangle avec des coins arrondis
Une ellipse
Trois points de suspension au - dessus de l'autre
deux ellipses
Une ligne
Un polygone à trois côtés ,
Un polygone à quatre côtés ,
Une étoile
une autre étoile
Une polyligne
un autre polyligne
Un chemin
Une courbe de Bézier quadratique
Écrire un texte
Tourner un texte
Texte sur plusieurs lignes
Texte en tant que lien
Définit la couleur d'une ligne, le texte ou le contour (stroke)
Définit la largeur d'une ligne, le texte ou le contour (stroke-width)
Définit différents types de terminaisons à un chemin ouvert (stroke-linecap)
Lignes pointillées Définit (stroke-dasharray)
Filtres SVG
feGaussianBlur - effet de flou
feOffset - décalage d' un rectangle, puis mélanger l'original sur le dessus de l'image d' offset
feOffset - flou l'image d' offset
feOffset - faire le noir de l' ombre
feOffset - traiter l'ombre comme une couleur
Un filtre feBlend
Filtre 1
Filtre 2
Filtre 3
Filtre 4
Filtre 5
Filtre 6
SVG Dégradés
Une ellipse avec un gradient linéaire horizontal du jaune au rouge
Une ellipse avec un gradient linéaire vertical du jaune au rouge
Une ellipse avec un gradient linéaire horizontal du jaune au rouge et un texte
Une ellipse avec un dégradé radial du blanc au bleu
Une autre ellipse avec un gradient radial du blanc au bleu
SVG Divers
Rectangle qui se fanent à plusieurs reprises à une distance de plus de 5 secondes
Un rectangle de croissance qui va changer la couleur
Trois rectangles qui vont changer la couleur
Déplacer le texte le long d' une trajectoire de mouvement
Déplacer, faire pivoter, et le texte à l'échelle le long d' une trajectoire de mouvement
Déplacer, faire pivoter, et le texte à l'échelle le long d' une trajectoire de mouvement + un rectangle de croissance qui va changer la couleur
Rotation des ellipses