SVG-vaatur

Kleebi töötlemata SVG-märgistus ja näe renderdatud eelvaadet kohe.

Eelvaade keelab skriptid ja välised viited, kuid lubab sul siiski uurida viewBoxi ja suuruse üksikasju.

SVG eelvaade: kleebi töötlemata kood ja kontrolli tulemust kohe

viewBoxi ja suuruse kontrollid: vaata läbipaistvust ja potentsiaalselt ohtlikku sisu

Sinu SVG-d ei saadeta kunagi serverisse. Töötlus toimub täielikult brauseris.
Ohtlikud elemendid ja väliste URL-ide viited on eelvaates keelatud.

Kasutamine

  1. Kleebi SVG-kood või laadi `.svg` fail.
  2. Vaheta tausta ja suumitaset, et renderdust uurida.
  3. Vaata üle viewBox, suuruse üksikasjad ja hoiatused ning salvesta vajadusel SVG.

Näidis

Lihtne ikooni SVG

Sisend

<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>

Väljund

Renderdatakse sinine ümmargune ikoon ning teabepaneelis kuvatakse viewBox väärtusena `0 0 120 120`.

KKK

Kas minu SVG laaditakse kuhugi üles?

Ei. Kleebitud SVG ja laaditud failid jäävad sinu brauserisse ega lähe serverisse.

Mis juhtub SVG-dega, mis sisaldavad script- või foreignObject-elemente?

Turvaline eelvaade eemaldab need elemendid enne renderdamist ja näitab teabepaneelis hoiatust.

Kas väliseid pilte või fonte sisaldavad SVG-d renderduvad täpselt samamoodi?

Mitte alati. Välised viited on keelatud, seega võib välimus algsest keskkonnast erineda. See tööriist eelistab turvalist kohalikku kontrolli.

Miks minu SVG ei renderdu?

Levinud põhjused on vigane XML, halvad atribuudiväärtused või juurelement, mis ei ole `svg`. Kontrolli tööriista kuvatavat veateadet.

Miks ma peaksin tausta vahetama?

Läbipaistvad alad ja heledad ikoonid võivad taustast sõltuvalt väga erinevad välja näha, seega lubab tööriist kiiresti proovida ruudulist, valget ja tumedat tausta.

Märkused

  • Ohutuse huvides keelatakse väliste URL-ide viited ja ohtlikud elemendid enne renderdamist.
  • SVG-d, mis sõltuvad välistest fontidest või piltidest, ei pruugi algses keskkonnas nähtuga samasugused välja näha.
  • Väga suured SVG-failid lülitavad reaalajas eelvaate automaatselt välja ja paluvad renderdada käsitsi.