SVG czy PNG — kiedy używać grafiki wektorowej, a kiedy pikseli
Czym różnią się SVG i PNG, który format wybrać do logo, ikony, strony i druku oraz jak uniknąć rozmytych krawędzi po eksporcie.
Wektor kontra piksele
SVG zapisuje linie i kształty jako instrukcje rysowania, dlatego skaluje się bez utraty ostrości. PNG jest siatką pikseli: dobrze zachowuje szczegóły i przezroczystość, ale powiększony traci jakość.
| Zastosowanie | Lepszy format |
|---|---|
| logo i ikony na stronie | SVG |
| prosta grafika z ostrymi krawędziami | SVG lub PNG |
| zrzut ekranu | PNG |
| fotografia | JPG, WebP lub AVIF |
| program bez obsługi SVG | PNG |
Kiedy zamienić SVG na PNG
PNG przydaje się w dokumentach, mediach społecznościowych i programach, które nie otwierają wektorów. Użyj konwertera SVG na PNG i wybierz docelową szerokość od razu większą, niż potrzebujesz.
Pułapki
- Tekst w SVG zależy od czcionki — przed publikacją zamień go na krzywe.
- Bardzo małe ikony sprawdź przy docelowym rozmiarze, bo cienkie linie mogą zaniknąć.
- Logo zapisuj w dwóch wersjach: wektor jako źródło i PNG do użycia poza stroną.
Pozostałe formaty porównuje poradnik JPG, PNG czy WebP, a konwerter obrazów zamieni je między sobą. Tło logo usuniesz tutaj według poradnika logo bez tła. Ikonę strony przygotujesz w generatorze favicon (zob. jak dodać favicon).
Narzędzia do tego poradnika
SVGPNGgrafika wektorowalogoformaty obrazów