SVG-vektorgrafikk (.svg)
W3C StandardScalable Vector Graphics (SVG) er et XML-basert vektorbildeformat for todimensjonal grafikk med støtte for interaktivitet, CSS-styling og animasjon.
Konverter SVG til PNG
Gratis SVG til PNG-konverterer i nettleseren. Konverter filer umiddelbart på enheten din.
Komprimer SVG på nett
Privat - filer forlater aldri enheten din
Inspeksjon og metadata
Operativsystemer og filanalysatorer identifiserer SVG-filer ved å undersøke den innledende binære bytesekvensen:
Filsignatur på bytenivå (magiske byte)
Operativsystemer og filanalysatorer identifiserer SVG-filer ved å undersøke den innledende binære bytesekvensen:
HEX-SIGNATUR (OFFSET 0):
3C 73 76 67ASCII-REPRESENTASJON: <svg
Standardisering: W3C Recommendation (SVG 1.1 / SVG 2)
Tekniske spesifikasjoner
| Beholderarkitektur | XML-basert tekstdokument som definerer 2D-vektorgeometri |
| Komprimering | Gzip- / Brotli-tekstkomprimering (SVGZ bruker gzip-komprimering) |
| Bytterekkefølge | Ikke aktuelt (tekstbasert UTF-8-/UTF-16-tegnstrøm) |
| Fargerom | sRGB, CSS Color Module 4 (Display P3, lab, lch) |
| Kanaler og struktur | Ubegrenset oppløsning på vektorformer, bézier-kurver, typografi og opasitetsmasker |
| Maks. dimensjoner | Oppløsningsuavhengig (skalerer uendelig til hvilken som helst visningsflate uten pikselering) |
| Gjennomsiktighet | Full variabel alfagjennomsiktighet og CSS-blandingmoduser |
| Strømming og progressiv visning | Parsing av progressive tekststrømmer støttes av nettleserens XML-parser |
Teknisk sammenligningsmatrise: SVG sammenlignet med konkurrenter
| Teknisk attributt | SVG (Gjeldende) | HTML5 Canvas | PNG | |
|---|---|---|---|---|
| Gjengivelsesmodell | Beholdt modus for vektor-DOM | Umiddelbar modus for punktgrafikklerret | Beholdt modus for fast sidebeholder | Rasterisert pikselnett |
| Styling og CSS | Fullt mulig å style via CSS-klasser og variabler | Krever omtegninger via JavaScript canvas-API | Ingen dynamisk CSS-styling | Faste rasterpiksler |
| Uendelig skalerbarhet | Ja (matematiske vektorkurver) | Krever manuell oppløsningsskalering | Ja (vektorelementer) | Nei (blir pikslete ved forstørrelse) |
| Interaktivitet | Native DOM-hendelser (pekerbevegelser, klikk, animasjoner) | Krever manuell matematikk for treffdeteksjon | Statisk dokument | Krever bildekart eller lerret |
Vanlige korrupsjonsmoduser og heksadesimal gjenopprettingsveiledning
Nettleseren viser XML-parsingfeil: uavsluttet tegn eller ikke-matchende tagg.
Underliggende årsak: Ugyldig XML-syntaks, manglende avsluttende tagger eller uundgagne et-tegn ('&' i stedet for '&').
Utbedring: Valider med en XML-linter (xmllint file.svg) og rett opp ubalanserte tagger.
Sikkerhetsanalyse og angrepsvektorer mot parsere
Fordi SVG er kjørbar XML som støtter '<script>'-tagger og eksterne enheter, utgjør SVG betydelige XSS- og SSRF-risikoer hvis ikke-tillitsvekkende SVG-filer vises.
Kjente angrepsvektorer
- Lagret tverrnettsteds-skripting (XSS) via innebygde '<script>'-tagger eller 'onload='-hendelsesbehandlere.
- XML External Entity (XXE)-angrep som leser lokale serverfiler når de tolkes på backend-servere.
- Billion Laughs XML-entitetsutvidelse som forårsaker tjenestenekt.
Anbefalte sikkerhetstiltak: Rens alltid SVG-er ved hjelp av DOMPurify før innbygging, eller lever SVG-er med 'Content-Security-Policy: default-src 'none'' eller som '<img>'-tagger som automatisk deaktiverer skript.
Historisk opprinnelse og milepæler
Viktige fordeler
- Uendelig oppløsningsuavhengighet: skarpe linjer og typografi i alle skjermstørrelser og ved alle utskriftsstørrelser.
- Ekstremt liten filstørrelse for logoer, ikoner og brukergrensesnittelementer.
- Fullt skriptbar og mulig å style via CSS og JavaScript inne i nettleserens DOM.
Tekniske begrensninger og ulemper
- Uegnet for fotografier eller kompleks bildegjengivelse med kontinuerlige toner.
- Komplekse vektorkurver med tusenvis av noder kan føre til treg gjengivelse på CPU-en og høyt batteriforbruk.
- XML-naturen tillater innebygd skripting, noe som krever streng rensing før gjengivelse av ikke-tillitsvekkende opplastinger.
Interessante tekniske fakta
- Gzip kan redusere størrelsen betydelig for enkelte SVG-filer; reduksjonen avhenger av dokumentinnholdet og komprimeringsinnstillingene.
- Attributtet viewBox definerer et abstrakt koordinatlerret som tilpasses dynamisk til fysiske skjermpiksler.
- Tidlige nettlesere manglet opprinnelig innebygde SVG-motorer, noe som førte til at Adobe distribuerte nettlesertillegget Adobe SVG Viewer før den innebygde nettleserstøtten stabiliserte seg rundt 2011.
Ofte stilte tekniske spørsmål
Kan SVG-filer inneholde skadelig kode?
Ja. Fordi SVG er gyldig XML, kan den inneholde innebygd JavaScript ('<script>') som kjøres hvis SVG-en lastes direkte i en nettleser eller åpnes i et innebygd '<svg>'-element. Å levere SVG-er via en '<img>'-tagg nøytraliserer automatisk skriptkjøring.
Når bør jeg bruke SVG i stedet for PNG?
Bruk SVG for ikoner, logoer, diagrammer, illustrasjoner og typografi der skarp skalering på tvers av alle skjermstørrelser og små filstørrelser er nødvendig. Bruk PNG eller WebP for fotografier.
Hvordan kan jeg optimalisere store eller komplekse SVG-filer?
Du kan rydde opp i vektorbaner ved å fjerne overflødige metadata, redigeringskommentarer fra Inkscape eller Illustrator, usynlige grupper og ubrukte navneromsdeklarasjoner ved hjelp av verktøy som SVGO eller SVG-komprimering.
Relaterte konverteringspar for SVG
Konvertering av SVG-vektorfiler til PNG-rasterbilder forvandler skalerbare kodebaserte grafikkfiler til faste pikselrutenett for universell applikasjonskompatibilitet.
Pakk rasterbaserte PNG-bilder inn i en SVG XML-vektorcontainer for responsiv skalering på nettet og integrering i vektorbaserte oppsett.
Kompiler eldre 16-bits Windows GDI-vektortegningsposter til moderne, skalerbare SVG-stier uten tap av oppløsning.
Konverter 32-biters Windows Enhanced Metafile-grafikk til rene, responsive SVG-vektorer for nett- og designprogramvare.
Konvertering av en DXF-tegning til en CAD SVG-eksport forvandler komplekse ingeniørvektordata til lettvekts XML-grafikk for nettlesere og vektoreditorer.
Konvertering av skalerbar vektorgrafikk til Drawing Exchange Format oversetter nettklare visuelle vektorer til nøyaktige matematiske koordinater som kreves av datastøttet designprogramvare.
Del en SVG-logo eller -illustrasjon som en PDF på én side. De skalerbare banene blir til et bilde med fast oppløsning, så det er ikke mulig å hente tilbake vektordetaljene ved å zoome.