Šta je SVG?

SVG, или Skalabilne Vektorske Grafike, je vektorski format slike zasnovan na XML za dvodimenzionalnu grafiku.

Ključne osobine:

• Skalabilnost: Slike ostaju oštre pri bilo kojoj skali, jer su opisane matematičkim formulama, a ne pikselima.
• XML format: Struktura SVG fajlova opisuje se tagovima, slično HTML-u. To ih čini čitljivim i uređivim tekstom.
• Interaktivnost: Mogućnost dodavanja interaktivnih elemenata pomoću JavaScript-a.
• Animacija: Podrška za animaciju elemenata pomoću CSS ili JavaScript-a.
• Pristupačnost: Mogućnost opisivanja sadržaja za osobe sa invaliditetom.
• Laganost: SVG fajlovi mogu biti manji od raster slika iste kvalitete.

Načini korišćenja SVG:

• Ugradnja u HTML putem <svg> taga:

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

• Korišćenje kao pozadinska slika u CSS-u:

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

• Kroz <img> tag:

  <img src="image.svg" alt="Moj SVG prikaz">
  

• Kroz <object> ili <iframe> tagove.

SVG je idealan za logotipe, ikone, ilustracije, grafikone i dijagrame, gde je važna jasnoća pri različitim veličinama i mogućnost interaktivnosti.