デザインのプロトタイプを作っている時に便利なのがplaceholdです。パラメータに応じて画像の色を変えたり、画像自体の大きさを自由に変更できます。他にもフォントの大きさや色も変えられるのですが、パラメータをいちいち覚えておくのも面倒です。 そこで使ってみたいのがplacehold-cliです。対話型でplaceholdのURLを取得できます。

placehold-cliの使い方

コマンドを実行しているところです。

$ placehold
? Width(px) 300
? Height(px) 400
? Background Color(hex) fb0
? Text Hello
? Font Color(hex) FFF
? Font Size(px) 35
url: https://placehold.jp/35/fb0/FFF/300x400.png?text=Hello
Copied url.

クリップボードにURLがコピーされますので、後はこれをデザインに使っていけば良いだけです。

一度URLを作ってしまえば後はちょっとずつ変更していくだけでデザインが組み上がっていくのではないでしょうか。機能が多くなると使い方を覚えるのが大変になりますので、こうした専用ツールが欠かせなくなるでしょう。

placehold-cliはnode/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

abouthiroppy/placehold-cli: Creates dummy image via https://placehold.jp/.