Så redigerar du SVG-filer i webbläsaren

SVG (Scalable Vector Graphics) lagrar en bild som former och banor: matematik, inte pixlar. Det är därför en logotyp som sparats som SVG förblir knivskarp oavsett om det är en favicon eller en affischtavla, och därför det är rätt format för ikoner, logotyper och illustrationer. Det betyder också att du kan öppna filen och redigera de faktiska formerna i stället för att flytta pixlar.

Att redigera SVG-källan är nästan alltid bättre än att redigera en exporterad PNG. Flytta en ankarpunkt och kurvan förblir mjuk; ändra en fyllning och färgen blir exakt; skala om hela objektet och inget blir suddigt. För det behöver du en redigerare som förstår vektorer.

EditItAlls vektorredigerare öppnar SVG-filer direkt i webbläsaren:

• Öppna redigeraren och läs in din .svg-fil: en logotyp, en ikonuppsättning eller en illustration.
• Använd markeringsverktyget (V) för att flytta och ändra storlek på hela objekt, och verktyget för direkt markering (A) för att fånga enskilda ankarpunkter.
• Byt färg på fyllningar och konturer, redigera valfri text med textverktyget (T) och finjustera former med smarta hjälplinjer och genvägar i Illustrator-stil.

Ditt arbete sparas automatiskt i webbläsaren medan du håller på, och hela redigeraren fortsätter att fungera om du går offline efter att sidan har laddats: ett tydligt tecken på att din fil inte skickas någonstans.

Den verkliga kraften ligger i att forma om banor. Pen tool (P) placerar ankarpunkter med bezierhandtag, så att du kan rita om en kurva, lägga till en punkt på en logotyp eller rita en ny form från grunden. Pennan är till för frihandsteckning.

För att bygga mer komplexa illustrationer kombinerar du enklare former med booleska operationer: Förena för att smälta samman dem, Minus fram för att stansa ut en form ur en annan, Snitt för att bara behålla överlappet, och Uteslut för att ta bort det. Dessa körs på en geometrimotor med exakt aritmetik, så att kanterna förblir rena i stället för att glida med bråkdelar av en pixel. Så förvandlar du några rektanglar och cirklar till en färdig ikon.

När du är klar sparar du tillbaka som .svg för att hålla filen fullt redigerbar, eller exporterar en PNG i 2× när du behöver en rasterbild för webben eller ett dokument. Om du redan har en SVG och bara vill ha en PNG gör den dedikerade SVG-till-PNG-konverteraren det i ett steg.

Två ärliga begränsningar: redigeraren läser standard-SVG, inte Adobes .ai- eller .eps-filer, och den hanterar inte gradientnät, mönsterfyllningar eller CMYK-färg. Men för att redigera vardagliga logotyper, ikoner och illustrationer som SVG körs allt du behöver på din enhet. Öppna vektorredigeraren för att komma igång.