ダミーの画像やテキストを提供するweb components・「</placeholders>」

</placeholders>

</placeholders>はダミーの画像やテキストを提供するweb componentsです。SVGで生成され、動作も高速です。

使い方もシンプル。勿論ReactやSvelte、VueなどのJSフレームワーク等でも利用可能です。

<script
  type="module"
  src="https://unpkg.com/@placeholders/core@0.0.2/dist/esm/placeholders.js"></script>

スクリプトを読み込んで

<placeholder-image></placeholder-image>

このようなタグを使えば良いだけ。

<placeholder-image width="400" height="200" text="Hello World"></placeholder-image>

従来のダミー画像生成サービス同様、サイズ指定や任意の文字列を使う事も出来ます。

<placeholder-text item-height="8">
Lorem ipsum dolor sit amet, consectetur adipiscing elit
</placeholder-text>

ダミーテキストは書かれた文字に応じた幅になるみたいです。

覚えておくと地味に便利かもですね。ライセンスはMIT。
</placeholders>