WEB制作を行う上で必要なものというと画像編集ソフトやテキストエディタ、FTPソフト等がありますが、今回はWEB制作に役立つ便利なツールを2つ紹介したいと思います。

レスポンシブ対応の為にブラウザのウィンドウサイズや、デザインを統一するためにWEB上の各要素の幅・高さ・余白の間隔、色などを知りたい時が沢山あります。

開発者ツールや画像編集ソフトで調べられますが、起動して調べる箇所を選択するのに結構手間がかかります。もっと手軽に調べたいものです。

そんな時に役立つのが、画面上スポイトツールと定規ツールです。

【ColorPicker】画面上のスポイトツール

ダウンロード
https://www.vector.co.jp/soft/dl/win95/art/se350616.html

フリーソフト。インストール不要でダウンロード後に解凍して起動するだけで、画面上どこからでも色を取得できます。デュアルモニターでも使えます。

５種類の形式でクリップボードに色を保存することが出来ます。
ルーペがあるので狙った場所を簡単に指定できます。

色取得後もプログラムは終了せず、システムに常駐している間は最後に選択した形式で取得できます。
常駐を終了する際は、タスクマネージャのカラーピッカーアイコンを右クリックで「終了」を選択してください。

・ショートカットキー
[Ctrl] ＋ [Alt] ＋ [Q]　・・・プログラムの常駐時にピッカーを起動します。
[Esc]　または　[Alt] + [F4]　・・・ピッカー起動時に色取得をキャンセルします。

【Medir】画面上のL字型定規ツール

ダウンロード
https://www.vector.co.jp/soft/win95/art/se319323.html

フリーソフト。インストール不要でダウンロード後に解凍して起動するだけで、画面上どこでもL字型定規でピクセル単位のサイズを測定できます。定規の長さも自由に変えられます。

メジャー上で右クリックするとメニューが開きます。
定規の回転や目盛りの位置・方向も変更できます。

照準アイコンをドラッグすると斜め方向の長さ・XY座標も測定できます。

右クリックメニューのコンソール表示で、目盛りの値や定規の色などの変更もできます。

まとめ

動作が軽く手軽に使えるこの２つのツールは大変重宝しており、開発者ツールや重い画像編集ソフトを起動し色や長さを調査するのと比べると、かなりの時間短縮になります。
古いソフトではありますが、私のWin10では問題なく使えています。これからもお世話になります。

他のスポイトツール・定規ツールも色々試してみましたが、私はこの２つが一番使いやすかったです。使ったことが無い方は是非一度試してみてください。

この記事を読んだ方はこちらも読まれています

地味に役立つAdobe XDプラグイン 「syncer」のHTML/CSSコード整形ツール 【注意喚起】WPA2の脆弱性「KRACKs」について Android端末でPDFを表示するには「PDF.js」