Vizualizator SVG
Lipește markup SVG brut și previzualizează imediat rezultatul randat.
Previzualizarea dezactivează scripturile și referințele externe, dar îți permite totuși să inspectezi viewBox și detaliile de dimensiune.
Previzualizare SVG: lipește codul brut și verifică rezultatul instant
Verificări viewBox și dimensiune: revizuiește transparența și conținutul potențial nesigur
Cum se folosește
- Lipește cod SVG sau încarcă un fișier `.svg`.
- Schimbă fundalul și nivelul de zoom pentru a inspecta randarea.
- Revizuiește viewBox, detaliile de dimensiune și avertismentele, apoi salvează SVG-ul dacă este nevoie.
Exemplu
SVG simplu de iconiță
Intrare
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120"><circle cx="60" cy="60" r="52" fill="#0ea5e9"/><path d="M36 62l16 16 32-40" fill="none" stroke="#fff" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"/></svg>
Ieșire
O iconiță circulară albastră este randată, iar viewBox este afișat ca `0 0 120 120` în panoul de informații.
Întrebări frecvente
SVG-ul meu este încărcat undeva?
Nu. SVG-ul lipit și fișierele încărcate rămân în browserul tău și nu sunt trimise pe un server.
Ce se întâmplă cu SVG-urile care conțin script sau foreignObject?
Previzualizarea sigură elimină acele elemente înainte de randare și afișează un avertisment în panoul de informații.
SVG-urile cu imagini sau fonturi externe se vor afișa exact la fel?
Nu întotdeauna. Referințele externe sunt dezactivate, așa că aspectul poate diferi de mediul original. Acest instrument pune accent pe o inspecție locală, sigură.
De ce nu se randază SVG-ul meu?
Cauze frecvente sunt XML-ul invalid, valorile greșite ale atributelor sau un element rădăcină care nu este `svg`. Verifică mesajul de eroare afișat de instrument.
De ce aș schimba fundalul?
Zonele transparente și iconițele deschise la culoare pot arăta foarte diferit în funcție de fundal, așa că instrumentul îți permite să testezi rapid fundalurile tip tablă de șah, alb și întunecat.
Note
- Din motive de siguranță, referințele la URL-uri externe și elementele periculoase sunt dezactivate înainte de randare.
- SVG-urile care depind de fonturi sau imagini externe pot să nu arate la fel ca în mediul original.
- Fișierele SVG foarte mari ies automat din modul de previzualizare live și trebuie randate manual.