SVG URL-kodare
Konvertera SVG-markering till en CSS-färdig data-URI och avkoda data-URI tillbaka till SVG.
SVG URL-kodare
Klistra in en SVG och få en data-URI som du kan släppa direkt till CSS, redo för bakgrundsbild eller en mask. Istället för base64 använder kodaren den kompakta URL-kodningsmetoden: den byter ut dubbla citattecken mot enkla citattecken, kollapsar blanksteg och procentkodar endast de tecken som faktiskt behöver det, så att resultatet förblir kort och läsbart för människor. Det håller din stilmall mindre än en base64-klump och låter dig fortfarande känna igen formerna inuti URI:n.
Tre utdataformat täcker de vanliga fallen. CSS-regeln lindar data-URI i bakgrundsbild: url("..."); så att du kan klistra in en hel deklaration. Den blotta data-URI ger dig bara värdet för en anpassad egenskap, en <img> src eller en SVG-mask. Base64-formuläret producerar en UTF-8-säker data:image/svg+xml;base64 URI för verktyg eller byggsteg som förväntar sig den kodningen, inklusive SVG:er med emoji eller textnoder med accent.
Växla riktningen till avkodning och verktyget vänder någon av de tre formerna tillbaka till rå SVG-uppmärkning. Klistra in en CSS-regel, en blottad data-URI eller en base64, och den extraherar SVG så att du kan redigera en ikon som bara finns i en stilmall. Sammanställningen visar inmatningsstorleken, utdatastorleken och procentuell förändring, så att du med ett ögonkast kan se om kodningen krympte eller ökade ikonen.
Allt körs i din webbläsare. Din SVG-märkning laddas aldrig upp, så du kan koda privata ikoner, logotyper och interna tillgångar utan att de lämnar din enhet.