SVG Renderer

使い方

1. 名前空間付きの <svg> ルート要素を含む完全な SVG コードを貼り付けます。
2. 出力 PNG の幅と高さを設定します（各辺最大 4096px）。
3. 描画するを押すと、ブラウザが解釈した結果がプレビューに表示されます。
4. PNG を出力→ダウンロードでラスター化したファイルを保存します。

よくある用途

• アイコンのラスター化 —— 古い環境やデザイン仕様向けに SVG アイコンの PNG 版を用意。
• コードの素早い確認 —— ライブラリやジェネレーターが出力した SVG を、組み込む前に目視確認。
• 固定サイズの出力 —— スクリーンショットを拡縮せず、指定ピクセルで 1 枚生成。

よくある質問

Q: エクスポートでセキュリティエラーが出るのは？ A: SVG がリモート画像やフォントなど外部リソースを参照している場合、キャンバスが汚染され、ピクセル出力がブロックされます。外部参照を取り除いて再描画してください。

Q: SVG 自身の width/height より入力値が優先されますか？ A: PNG は入力した幅と高さどおりに描画され、マークアップの固有サイズには従いません —— これが固定サイズ出力を再現可能にする仕組みです。

Q: 描画しても真っ白な場合は？ A: 定番の原因：ルート要素に xmlns 名前空間がない、タグの閉じ忘れ、img コンテキストで扱えない XML 機能。マークアップを修正してから再描画してください。