Formatgrunder· 5 min läsning

Så öppnar du en SVG-fil: dator, telefon och webbläsare

Så öppnar du en SVG-fil på dator, telefon och i webbläsare, löser problem med kod eller tomt fönster, redigerar utan att installera programvara eller visar den som PNG.

1. Fyra sätt att öppna en SVG på en dator

  • Webbläsaren (enklast): dra SVG-filen in i ett fönster i Chrome, Edge, Firefox eller Safari så visas den; du kan också högerklicka på filen, välja ”Öppna med” och peka på en webbläsare;
  • Ange standardprogram: om du ofta arbetar med SVG, koppla .svg-filer till en webbläsare eller ett designprogram så att ett dubbelklick öppnar dem direkt;
  • Designprogram: Illustrator, Figma och det fria Inkscape öppnar och redigerar SVG, vilket passar mer omfattande arbete;
  • Kodredigerare: SVG är i grunden XML-text, så att öppna den i VS Code låter dig visa och ändra källan, vilket gör felsökning mycket enklare.

Så anger du ett standardprogram: i Windows högerklickar du på SVG-filen, väljer ”Öppna med → Välj en annan app” och markerar ”Använd alltid den här appen”; i macOS högerklickar du och väljer ”Get Info”, pekar på en webbläsare under ”Öppna med” och klickar ”Ändra alla”, så att dubbelklick förhandsgranskar filen från och med nu.

2. Så öppnar du en SVG på en telefon

Android: vissa filhanterare kan inte förhandsgranska SVG direkt — tryck länge på filen, välj ”Öppna med” och peka på en webbläsare. iPhone: spara SVG i Files-appen, där nyare system förhandsgranskar den direkt; om den inte visas, dela den och öppna den i Safari. SVG:er som kommer i WeChat eller QQ levereras som vanliga filer, och ”Öppna med” en webbläsare visar dem korrekt.

Totalt sett är mobilwebbläsaren den mest tillförlitliga SVG-visaren — ingen extra app behöver installeras. Tabletter fungerar på samma sätt: öppna filen i den inbyggda webbläsaren, ingen särskild visare behövs.

3. Vad gör du om ett dubbelklick visar kod eller ett tomt fönster?

En vägg av kod: filen är kopplad till Anteckningar eller en annan textredigerare. SVG är text, så det är normalt — öppna den i en webbläsare så ser du bilden. Ett tomt fönster: kontrollera först att filen är intakt. Öppna den i en kodredigerare: en giltig SVG börjar med taggen <svg> eller deklarationen <?xml. Ser du <html> istället har du förmodligen sparat en felsida som .svg när du laddade ner, så ladda ner filen igen. Om filen dessutom refererar till externa bilder eller typsnitt saknas resurserna och bilden blir ofullständig.

En sak till: SVG är ett textformat som kan bära skript, så öppna inte filer från okända källor direkt i webbläsaren. Kontrollera dem först i en kodredigerare, bekräfta att filen börjar med en svg-tagg och inte innehåller misstänkta skript, och förhandsgranska först då.

4. Vill du ändra något efter att du öppnat? Använd online-editorn

För att färga om en logotyp, ta bort en bakgrund eller radera några element behöver du inte ett tungt program. Öppna PolySVG online-SVG-editorn (direktlänk: /editor), ladda upp filen och du kan klicka på sökvägar för att radera dem, ta bort bakgrunder med ett klick, färga om, måla med penseln, sudda med sudden samt ångra och göra om närhelst, och exportera sedan SVG eller PNG. Gratis, ingen installation, ingen registrering.

5. Vill du bara titta? Att konvertera till PNG är enklast

Kan inte motpartens enhet öppna SVG är den enklaste lösningen att konvertera till PNG: exportera en PNG från editorn, eller ta en skärmbild i webbläsaren. För att förstå formatet SVG i sig, läs Vad är SVG; har du en bitmap du vill göra om till SVG sköter verktyget Bild till SVG det på några steg.

Är du utvecklare kan du också bädda in SVG direkt i HTML eller referera till den med en img-tagg, och webbläsaren renderar den direkt — så är det vanligaste sättet att visa SVG på webben.

Vanliga frågor

Är det normalt att ett dubbelklick på en SVG visar en vägg av kod?

Ja. SVG är i grunden XML-text, så standardprogrammet blir en textredigerare; öppna den i en webbläsare i stället så ser du bilden.

Kan jag se en SVG på telefonen utan designprogram?

Ja. Använd bara mobilwebbläsaren: i Android väljer du en webbläsare i filhanteraren och på iPhone sparar du filen i Files och öppnar den med Safari.

Testa direkt

Klart med handledningen? Öva med PolySVGs gratis verktyg:

Läs vidare