プレースホルダー生成

ツール概要

低解像度のぼかしプレビュー（LQIP）やSVGの抽象プレースホルダーで、遅延読み込み時のレイアウトシフトを抑制しUXを向上します。

使い方

1. 画像をドロップして解析。
2. LQIP品質やSVGのパス数、色数、ぼかし強度を調整。
3. 生成されたData URIやSVGをHTML/JSへ貼り付け。

活用例

• Lazy Load時の視覚的な空白解消。
• 記事一覧やカードUIの初期印象改善。
• LCP/INPの改善に寄与。

ポイント・知識

• LQIPは1〜数KB程度が目安。大きすぎると逆効果。
• ぼかしは強すぎないほうが◎（被写体が想像できる程度）。
• 主要色抽出と組み合わせ、背景色と馴染ませると自然。