サイズ
800 x 450
出力
<svg width="800" height="450">...
デザインツール
SVGプレースホルダー生成 - サイズとラベル付きプレースホルダー
width、height、background、label text、font size から軽量な SVG placeholder を生成できます。prototype の image slot、list skeleton、loading placeholder に使いやすく、準備できたら SVG markup をそのままコピーできます。
SVGPlaceholderPrototype
このツールをお気に入りに
お気に入りの保存方法がまだ選ばれていません。
クイック操作
このツールの URL をコピーするか、対応端末ではシステムの共有シートを開けます。
设计配色
SVGプレースホルダー生成
width、height、background、label text、font size から軽量な SVG placeholder を生成できます。prototype の image slot、list skeleton、loading placeholder に使いやすく、準備できたら SVG markup をそのままコピーできます。
Data URI (SVG)
Placeholder ready.
利用シーン
- prototype 中の image slot を埋める
- 固定サイズの placeholder を作る
- 軽量な demo asset を用意する
使い方
- width と height を設定する
- label text と色を入力する
- SVG をコピーする
入出力サンプル
FAQ
raster image としてダウンロードできますか？
このツールの出力は SVG text です。必要なら保存するか、SVG-to-PNG ツールで bitmap へ変換してください。
img src で使えますか？
はい。SVG を file として保存するか、project に合わせて data URL / PNG へ変換して利用できます。
ツール
関連ツール
近い用途の翻訳済みツールへ続けて進めます。
SVG から PNG に変換
SVG から PNG に変換 - ローカルでベクターをラスター化
SVG マークアップをブラウザ内で Canvas に描画し、指定倍率で PNG として書き出します。アイコンの書き出し、ドキュメント用図版、複数解像度プレビューの生成に便利です。
SVG PNG 変換
SVGカラーエディター
SVGカラーエディター - fill と stroke を編集
SVG markup を貼り付けると fill / stroke の色を抽出して編集可能な palette として表示し、変更内容をライブプレビューしながら更新後の SVG をコピーできます。icon の recolor や簡単な vector tint 調整向けです。
SVG Recolor Icons