<p class="thumb"><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2011/11/pictures-to-color.jpg" alt="画像から色コードをコピー、一覧できる「Pictures To Color」" title="pictures-to-color" width="514" height="204" class="aligncenter size-full wp-image-19052" /></p>

<p>
画像から<a href="/tag/カラーコード">カラーコード</a>を取得するようなサービスには<a href="/web-tools/pic2color-image-color-extractor.html">Pic2Color</a>のようなものもありますが、配色を一覧するカラーパレットの操作性や視認性がいまいちだったり、カラーコードがHEX形式だけだったりします。</p>

<p>また、サイトから直接使っている色を抜き出す<a href="/web-tools/i-like-your-colors-get-colors-from-webpage.html">I Like Your Colors</a>のようなものは、これまた見た目もいまいちで、HEXのみ。どれも一長一短ありといった感じです。</p>
<p>今回ご紹介するのは、カラーコードをHEX以外のRGBなどの形式でもクリップボードにコピーでき、配色のカラーパレットをHTMLで一覧することもできるWindows用のフリーソフトです。</p><!--more-->

<h3 class='header-label'>画像から色コードをコピー、一覧できる「Pictures To Color」</h3>
<p>「<a href="http://www.wenovo.com/freeware/download-pictures-to-color.php" target="_blank">Pictures to Color</a>」は、<strong>選択した画像で使われているカラーコードを一覧し、カラーコードのコピーやカラーパレットの生成をおこなえるWindow用のフリーソフト。</strong></p>
<p>配色のカラーパレットはHTML形式で保存することができ、ひとに共有したいときにも便利です。</p>

<h4 class='tips'>画像からカラーパレットを生成</h4>
<p><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2011/11/pictures-to-color1.png" alt="カラーパレット" title="pictures-to-color1" width="500" height="380" class="aligncenter size-full wp-image-19051" />
<br />↑画像を選択すると、その画像で使われている色をカラーパレットで表示してくれます。ブラウザの拡張機能よりは一手間かかりますが、<a href="/blog/screenpresso-pro-screenshot-soft.html">Screenpresso</a>などでサイトのキャプチャを撮ってサイトの配色を抜き出すことも出来ますね。</p>



<h4 class='tips'>カラーパレットからカラーコードをコピー</h4>
<p><img src="http://d3qt5c962pj1kq.cloudfront.net/images/2011/11/pictures-to-color2.png" alt="カラーコードをコピー" title="pictures-to-color2" width="500" height="380" class="aligncenter size-full wp-image-19050" />
<br />↑表示されたカラーコードの横にあるアイコンをクリックし、カラーコードを選択すると、クリップボードにコピーされます。</p>

<p>コピーできるカラーコードの形式は、</p>

<ul><li>HEX 「#ffffff」</li><li>RGB 「rgb(255,255,255)」</li><li>HSB 「hsb(0,0,100)」</li><li>HSL 「hsl(0,0%,100%)」</li></ul>

<p>の４種類。それぞれ大文字や小文字など、複数の表現から選択してコピーすることが可能。読み取る画像のファイル形式はjpgやpngを始め、icoやpsd形式などにも対応しています。</p>


<h4 class='tips'>カラーパレットをHTML形式で保存</h4>

<iframe src="http://web-marketing.zako.org/files/google_color.html" scrolling="no" frameborder="0" width="522" height="500"></iframe>
<p><a href="/files/google_color.html" target="_blank">→ ページを開いて全体を見る</a></p>
<p>↑このカラーパレットはGoogleの検索結果ページをキャプチャして分析したもの。こちらも4種類のカラーコードで表示してくれます。</p>

<p>興味がある方は<a href="http://www.wenovo.com/freeware/download-pictures-to-color.php" target="_blank">Pictures to Color</a>へどうぞ。</p>

<p>「picturestocolor-setup.exe」をダウンロードして、そのファイルを起動することで使用できます。</p>

<p>配色を０から考えるのはなかなか難しいことですが、参考にしたいものから色を取り出して使えるようになるのはとても助かりますね。</p>