Vektorový formát SVG (.svg)
W3C StandardníScalable Vector Graphics (SVG) je vektorový obrazový formát založený na XML pro dvojrozměrnou grafiku s podporou interaktivity, stylů CSS a animace.
Převést SVG na PNG
Bezplatný konvertor z SVG do PNG v prohlížeči. Převeďte soubory okamžitě ve svém zařízení.
Komprese SVG online
Soukromě - soubory nikdy neopustí vaše zařízení
Kontrola a metadata
Operační systémy a analyzátory souborů identifikují soubory SVG kontrolou počáteční binární sekvence bajtů:
Podpis hlavičky na úrovni bajtů (Magic Bytes)
Operační systémy a analyzátory souborů identifikují soubory SVG kontrolou počáteční binární sekvence bajtů:
HEXADECIMÁLNÍ PODPIS (POSUN 0):
3C 73 76 67ASCII REPREZENTACE: <svg
Standardizace: W3C Recommendation (SVG 1.1 / SVG 2)
Technické specifikace
| Architektura kontejneru | Dokument značkovacího jazyka XML definující 2D vektorovou geometrii |
| Komprese | Textová komprese Gzip / Brotli (SVGZ používá kompresi gzip) |
| Pořadí bajtů | Nevztahuje se (Textový proud znaků UTF-8 / UTF-16) |
| Barevné prostory | sRGB, CSS Color Module 4 (Display P3, lab, lch) |
| Kanály a struktura | Vektorové tvary s neomezeným rozlišením, Bézierovy křivky, typografie a masky krytí |
| Max. rozměry | Nezávislé na rozlišení (škáluje se nekonečně na jakýkoli výřez bez pixelace) |
| Průhlednost | Plně proměnlivá alfa průhlednost a režimy míchání CSS |
| Streamování a progresivní načítání | Parsování progresivního textového proudu podporované analyzátorem XML v prohlížeči |
Technická srovnávací matice: SVG vs konkurence
| Technický atribut | SVG (Aktuální) | HTML5 Canvas | PNG | |
|---|---|---|---|---|
| Model vykreslování | Vektorový DOM v režimu uchovávání | Bitmapové plátno v režimu okamžitého vykreslování | Kontejner stránky s pevným rozvržením v režimu uchovávání | Rastr pixelové mřížky |
| Styling a CSS | Plně stylovatelné pomocí tříd a proměnných CSS | Vyžaduje překreslení pomocí API plátna JavaScriptu | Žádný dynamický styling CSS | Pevné rastrové pixely |
| Nekonečná škálovatelnost | Ano (matematické vektorové křivky) | Vyžaduje ruční škálování rozlišení | Ano (vektorové prvky) | Ne (při zvětšení se pixeluje) |
| Interaktivita | Nativní události DOM (přechod myší, kliknutí, animace) | Vyžaduje ruční matematické výpočty pro detekci zásahu | Statický dokument | Vyžaduje obrazovou mapu nebo plátno |
Běžné režimy poškození a příručka pro obnovení v hex
Prohlížeč zobrazuje chybu parsování XML: neuzavřený token nebo neshodná značka.
Hlavní příčina: Chybná syntaxe XML, chybějící uzavírací značky nebo neošetřené ampersandy ('&' namísto '&').
Obnovení: Ověřte pomocí XML linteru (xmllint file.svg) a opravte nevyvážené značky.
Bezpečnostní analýza a vektory útoků na parser
Protože SVG je spustitelné XML, které podporuje značky '<script>' a externí entity, představuje značná rizika XSS a SSRF, pokud jsou zobrazeny nedůvěryhodné soubory SVG.
Známé vektory útoků
- Uložené Cross-Site Scripting (XSS) prostřednictvím vložených značek '<script>' nebo obslužných rutin událostí 'onload='.
- Útoky XML External Entity (XXE) čtoucí lokální soubory serveru při parsování na backendových serverech.
- Expanze entit XML Billion Laughs způsobující odepření služby.
Doporučené bezpečnostní postupy: Vždy vyčistěte soubory SVG pomocí DOMPurify před vnořením, nebo podávejte soubory SVG s hlavičkou 'Content-Security-Policy: default-src 'none'' nebo jako značky '<img>', které automaticky zakážou skripty.
Historický vývoj a milníky
Klíčové výhody a přednosti
- Nekonečná nezávislost na rozlišení: ostré čáry a typografie v jakémkoli měřítku zobrazení nebo tisku.
- Extrémně malá velikost souboru pro loga, ikony a prvky uživatelského rozhraní.
- Plně skriptovatelné a upravitelné pomocí CSS a JavaScriptu uvnitř DOM prohlížeče.
Technická omezení a nevýhody
- Nevhodné pro fotografie nebo složité snímky s plynulými přechody tónů.
- Složité vektorové cesty s tisíci uzlů mohou způsobit zpomalení vykreslování CPU a vysokou spotřebu baterie.
- Povaha XML umožňuje vložené skriptování, což vyžaduje přísné čištění před vykreslením nedůvěryhodných nahrání.
Zajímavé technické drobnosti
- Gzip může výrazně zmenšit některé soubory SVG; míra zmenšení závisí na obsahu dokumentu a nastavení komprese.
- Atribut viewBox definuje abstraktní souřadnicové plátno, které se dynamicky mapuje na fyzické pixely obrazovky.
- Ranné webové prohlížeče zpočátku postrádaly nativní enginy SVG, což přimělo společnost Adobe k distribuci doplňku prohlížeče Adobe SVG Viewer, než se nativní podpora prohlížeče ustálila kolem roku 2011.
Často kladené technické otázky
Mohou soubory SVG obsahovat škodlivý kód?
Ano. Protože SVG je platné XML, může obsahovat vložený JavaScript ('<script>'), který se spustí, pokud je SVG načteno přímo v prohlížeči nebo otevřeno ve vloženém prvku '<svg>'. Podávání SVG přes značku '<img>' automaticky neutralizuje spouštění skriptů.
Kdy mám použít SVG namísto PNG?
Použijte SVG pro ikony, loga, grafy, ilustrace a typografii, kde je vyžadováno ostré škálování napříč všemi velikostmi obrazovek a malé velikosti souborů. Pro fotografie použijte PNG nebo WebP.
Jak mohu optimalizovat velké nebo složité soubory SVG?
Vektorové cesty můžete vyčistit odstraněním nadbytečných metadat, komentářů editoru (z Inkscape nebo Illustratoru), neviditelných skupin a nepoužitých deklarací jmenných prostorů pomocí nástrojů jako SVGO nebo spuštěním komprese SVG.
Související konverzní páry pro SVG
Převedením vektorových souborů SVG na rastrové obrázky PNG se škálovatelná grafika založená na kódu transformuje na mřížku s pevnými pixely pro zajištění univerzální kompatibility aplikací.
Zapouzdřete rastrové obrázky PNG do vektorového kontejneru SVG XML pro responzivní změnu velikosti na webu a integraci do vektorově kompatibilních rozvržení.
Zkompilujte starší 16bitové záznamy vektorové kresby Windows GDI do moderních škálovatelných cest SVG s nulovou ztrátou rozlišení.
Převeďte 32bitovou grafiku Windows Enhanced Metafile na čisté, responzivní vektory SVG pro webový a designový software.
Konverze výkresu DXF do exportu CAD SVG převádí komplexní inženýrská vektorová data na lehkou grafiku XML pro webové prohlížeče a vektorové editory.
Konverze škálovatelné vektorové grafiky na formát pro výměnu výkresů (Drawing Exchange Format) převádí vizuální vektory připravené pro web na přesné matematické souřadnice požadované softwarem pro CAD.
Sdílejte logo nebo ilustraci SVG jako jednostránkové PDF. Její škálovatelné cesty se stanou obrázkem s pevným rozlišením, takže přiblížením nelze obnovit vektorový detail.