Ce este SVG?

SVG, sau Grafice Vectoriale Scalabile, este un format de imagine vectorial bazat pe XML pentru grafica bidimensională.

Caracteristici principale:

• Scalabilitate: Imaginile rămân clare la orice scară, deoarece sunt descrise prin formule matematice, nu pixeli.
• Format XML: Structura fișierelor SVG este descrisă prin etichete, similar cu HTML. Acest lucru le face lizibile și editabile în text.
• Interactivitate: Posibilitatea de a adăuga elemente interactive cu JavaScript.
• Animație: Suport pentru animație a elementelor cu CSS sau JavaScript.
• Accesibilitate: Posibilitatea de a descrie conținutul pentru persoanele cu dizabilități.
• Ușor: Fișierele SVG pot fi mai mici decât imaginile raster de aceeași calitate.

Moduri de utilizare SVG:

• Înglobare în HTML prin tag-ul <svg>:

  <svg width="100" height="100">
    <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
  </svg>
  

• Utilizare ca imagine de fundal în CSS:

  .element {
    background-image: url('image.svg');
  }
  

• Prin tag-ul <img>:

  <img src="image.svg" alt="Imaginea mea SVG">
  

• Prin tag-urile <object> sau <iframe>.

SVG este ideal pentru logo-uri, pictograme, ilustrații, grafice și diagrame, unde claritatea la diferite dimensiuni și posibilitatea de interactivitate sunt importante.