Úprava SVG online: přebarvujte a odstraňujte pozadí bez instalace

1. Co online SVG editor umí

První reakcí na úpravu SVG bývá instalace Illustratoru, ale pro lehké úkoly, jako je přebarvení, odstranění pozadí nebo smazání prvků, online editor bohatě stačí. Online SVG editor od PolySVG běží v prohlížeči, je zdarma, nevyžaduje instalaci ani registraci a umí pracovat na úrovni cest: kliknutí a smazání, odstranění pozadí jedním kliknutím, kreslení štětcem, mazání maskou, přebarvování, undo a redo a následný export SVG nebo PNG. Můžete nahrát SVG přímo, nebo si jedním kliknutím přivést výsledek z nástroje Obrázek na SVG. Designérům se hodí pro poslední úpravu před předáním; vývojářům pro rychlé doladění barev a rozměrů ikon, než se dostanou na stránku, a bez neustálého přebíhání mezi grafickým nástrojem a kódem.

2. Přebarvování: dejte ikoně novou témovou barvu

Kliknutím na barevnou plochu na plátně vyberete odpovídající cestu a v panelu barev pak vyměníte výplň. Typické scénáře: přepnutí jedné sady ikon mezi světlým a tmavým motivem, srovnání vektorizovaného loga s firemní barvou a sjednocení palety napříč materiály z různých zdrojů. Ve srovnání s hledáním atributu fill v kódu je přebarvování kliknutím mnohem přehlednější a mnohem méně náchylné k poškození jiných cest.

3. Odstranění pozadí: automaticky a ručně

Klikněte na „Odstranit pozadí jedním kliknutím“ a engine rozpozná dominantní barvu okraje a odstraní vrstvu pozadí, takže SVG s bílým pozadím se během několika sekund změní na průhledné. Zbylé cesty pozadí vyberete myší a smažete. Pokud máte zatím jen bitmapu, použijte nástroj pro převod obrázku na průhledný vektor, kde se převod a odstranění pozadí udělají v jednom kroku, a pak dokončete pročištění v editoru.

4. Štětec a guma: kreslení a mazání

Štětec přidává: doplní chybějící tahy a ty se automaticky vektorizují na nové cesty, které přirozeně splynou s původní grafikou — ideální na opravu přerušených tahů ve vektorizovaném logu. Guma ubírá: oblast skryje maskou, aniž by zničila původní data cest, a když ukrojíte příliš, můžete krok vrátit. Oba nástroje fungují spolu s undo a redo, takže se můžete bez obav experimentovat. Tahy štětcem se do souboru přidají jako samostatné cesty a lze je později přebarvovat kliknutím; efekt gummy se uplatní při exportu, takže exportované SVG odpovídá tomu, co vidíte na plátně.

5. Undo, redo a export

Editor si drží úplnou historii vašich kroků: chybu vrátíte a při změně názoru zopakujte. Hotovo? Exportujte SVG pro web nebo pro další úpravy, případně exportujte PNG do dokumentů či jako náhled. Způsoby otevření a prohlížení SVG popisuje Jak otevřít soubor SVG; přímý odkaz na editor je /editor. Při exportu PNG volte dostatečné rozlišení, aby grafika v dokumentu nebyla rozmazaná; na webu naopak upřednostněte SVG, které si zachová vektorové vlastnosti.

6. Přehled nejčastějších úloh

• Přebarvení ikon do motivu: vyberte cestu a vyměňte výplň, pak exportujte jednu verzi pro světlý a druhou pro tmavý motiv;
• Průhledný materiál z bílého pozadí: odstranění pozadí jedním kliknutím, smazání zbylých cest a export průhledného SVG;
• Oprava přerušených tahů v logu: doplňte mezeru štětcem, tahy se automaticky vektorizují a pak sjednotíte barvy;
• Smazání nežádoucích prvků: klikněte na každou nepotřebnou barevnou plochu a smažte ji, okraje upravíte gumou;
• Obrázek do dokumentu: po dokončení úprav exportujte PNG a vložte ho do Wordu, PowerPointu nebo chatu.