svg

dessin / image svg (Scalable Vector Graphics)

red1.svg

<svg width="320" height="240" xmlns="http://www.w3.org/2000/svg">
<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
<g>
<title>Calque 1</title>
<ellipse ry="19" rx="24" id="svg_1" cy="136" cx="206" stroke-width="5" stroke="#000000" fill="#FF0000"/>
<path id="svg_2" d="m213,168l46,-17l9,16l-39,12l-1,32l-51,1l-3,-25l-37,-22l10,-18l36,19l30,2z" stroke-width="5" stroke="#000000" fill="#FF0000"/>
</g>
</svg>
- l'image suivante depuis le code source

- l'image suivante est un .jpg

- l'image suivante est un .png

(2.7Ko, avec transparence) ici en 320x240
puis via fotoflexer.com changer la taille!! pour faire x icones

svgrepo.com ✨✨✨ 300000 vectors+icons in collections

framavectoriel.org/svg-editor.html editeur online puis export .png
la-cascade.io/ travailler avec des icones en svg
jakearchibald.github.io/svgomg online SVG viewer

test2018 (batterie, vtt Icons8, mammut ...)
globe (rotate) D3JS + .json .... cors pb if not http
globe2 (rotate) D3JS + .json (v2020)
Countries_of_Europe.svg avec liens wikipedia (550Ko)
globe (pseudo rotate, avec poisson) 42Ko (i)
planetaryjs.com/ encore mieux!
runner-silhouette-svgrepo-com.svg
two-dog-pawprints-svgrepo-com.svg
vtt.svg

logo lapin (h1 et a href)


vtt.svg avec un CSS class

vtt.svg avec un CSS class .logo-img2 {filter: invert(.5);}

vtt2.svg avec un CSS class .logo-img {fill: #444; }
^ src du .svg modifié pour avoir un style (que l'on peut maintenant modifier via une class)

avec un CSS class .logo-img2 {filter: invert(.5);}

juste un div


colored


wikidata

dans map.js
fill #16AFD1 = bleu clair


fill #307199 = bleu foncé

opacity:
developer.mozilla.org/ ... Attribute/opacity

carte monde/data (svg) ✨✨✨✨ par Stephan Wagner (avec .js pour changement de langue) 2020 (maj 2026)
carte monde (svg) div. autres exemples

copie locale des drapeaux du monde (autre version)... All country flags in SVG
avec 256 drapeaux (tot=3Mb)
src: hjnilsson/country-flags