普段使い可能な便利なカラーツールまとめ

color-block

こんにちは、デザイナー・ブロガーの
ゆっきー(@elcielo_design)です。

この記事では、普段使い可能な便利な
無料カラーツールをまとめています。

スポンサーリンク

普段使い可能な便利なカラーツール

「普段使い可能な便利なカラーツール」

 ジャンル  カラーツール名
 普段使い可能な便利系
 ① 〜 ⑩

 
 Adobe Color
 SCHEMECOLOR
 ColorDrop
 ColorKitty
 Pigment
 Color Supply
 HUE/360
 NIPPON COLORS
 Canvas Colors
 Sphere:
Color Theory Visualizer

配色選びに迷った際にまず始めに
参考にしている便利なカラーツール。
様々なニーズに対応できると思います。

スポンサーリンク

① Adobe Color

adobe-color

Adobe Colorは、Adobe社が提供する
あまり知られていない配色ツールです。

色の知識がなくてもバランスの取れた
色の組み合わせを簡単に実現できます。

 特徴 ・カラーハーモニー(色同士の関係性)から、
 優れた配色パターンを生成できる。
・中央にある丸いカラーピッカーの操作で
 色相や明度を変えることが可能。
・インターフェイスもシンプルで日本語対応
・他のデザイナーが作成した便利な
カラーギャラリー」等も備わっている。
・アップル製品(iPhone・iPadなど) で
 撮った写真素材からカラーパレット作成、
 Adobeサービスと連結して使える。
 その他 ・カラーハーモーの切り替えの種類
「類似」「モノクロマティック」「補色」
「トライアイド」「コンパウンド」
「シェード」「カスタム」

Adobe Color

Create color palettes with the color wheel, hex or image. Browse thousands of color combinations for usage in Photoshop, Illustrator etc.

② SCHEMECOLOR

schemecolor

SCHEMECOLORは、1万種類以上の
カラースキームがストックされている
Webサイトの1つになります。

 特徴 ・4〜6色の配色パターン見本サイト
・1万種類以上の豊富なカラーパターン
・配色の編集やダウンロード可能。
 その他  

SCHEMECOLOR

SchemeColor.com is a top-rated website to download, create and share thousands of beautiful color combinations. Get detailed information on hexadecimal colors c

③ ColorDrop

colordrop

ColorDropは、グリット上に
4色の配色の組み合わせが並ぶ
配色見本のサイトの1つです。

 特徴 ・4色の配色パターン見本サイト
・フラットデザインを作りやすいパレット
・16進数/RGBコードでカラーをコピー可。
・ソートやフィルタリング等の機能も多数。
・画面上部のプルダウンで人気順に変わる。
・画面上部の右の筆のアイコンを押すと、
 ダークモードや背景の変更ができる。
 その他  

ColorDrop

Thousands of curated colors, palettes for use in your products

④ ColorKitty

colorkitty

ColorKittyは、画像をアップロードすると
その画像に含まれる色を自動で抽出して、
カラーパレットを表示してくれるツール。

 特徴 ・画像からカラーを抽出するツール。
・選択された配色は画像上でドラック移動で
 色を変更することができる。
 その他  

ColorKitty

create, discover and share beautiful color palettes and colors.

⑤ Pigment

pigment

Pigmentは、Pigment (顔料) と
Lighting (光量) を調整しながら、
使いやすいナチュラルな配色を探せる
便利で珍しいカラーツールになります。

 特徴 ・2色の配色パターン見本サイト
・右上の検索ボックスから画像をベースに
 配色を見つけることも可能。
・DPT紙のデザインでもかなり重宝
 その他  

Pigment

A unique way to generate fresh and vibrant colors based on lighting and pigment, instead of math. Find a beautiful, free color palette in seconds to kick off yo

⑥ Color Supply

color-supply

Color Supplyは、カラーチャートを回し
好きな配色を探せる便利なツールです。

 特徴 ・2〜4色の配色パターン見本サイト
・類似色やトライアドなどの色相環から、
 優れた色の組み合わせを見つけられる。
・ポップで使い勝手の良いカラーツール
・アイコンイラストやグラデーションでも
 色をすぐに確認できるのが良い。
・3色の配色を探せる数少ないツールの1つ
 その他  

Color Supply

Use the color wheel to select a style you like. Then pick a hex code.

⑦ HUE/360

hue/360

HUE/360は、
「Brightness」で色の明るさを選択し
 使いたい色を色環からクリックすると、
 選べる色の数が減り相性のいい色だけ
 残っていくという便利なカラーツール。

 特徴 ・1つのキーカラーと調和する
 カラーを選んでくれるツール。
・ページ下で選択した色のHEX値まとめと
「Print User Color」でコードが見れる。
 その他 「shift + 色」で背景色を選んだ色に変化

HUE/360

⑧ NIPPON COLORS

nippon-colors

NIPPON COLORSは、
日本の伝統色を扱う代表的なサイト。

和風のデザインを作るときには、
是非参考にしたいサイトですね。

 特徴 ・見やすいスッキリしたカラーチャートと
 美しいアニメーションが魅力的なツール。
・日本の伝統色 (日本での色の呼び方) の
「名称」「CMYK /RGB」を確認可能。
・微妙な色の違いが名前で表現されている。
・右の「MUNSELL」を「ON」にすると
3Dになるという遊び心あるデザイン。
 その他 ※ 3Dは「Safari」「Chrome」しか
 見れないので注意が必要になる。

NIPPON COLORS

The Traditional Colors of Nippon (Japan). This site is optimized to Webkit.

⑨ Canva Colors

canva-colors

Colorsは、Canvaが提供している
カラーツールをまとめたページ。

 特徴 ・「Color palette generator」では、
 アップロードした写真から配色を抽出可能。
 (アップロードもドラッグ&ドロップで簡単)
・「Color palette ideas」では、
  約4000の4色の配色パターンを見れる。
・「Color wheel」では、
 色環(カラーホイール)で色の理論を学べる。
・「Color meanings」では、
 参考になる色の検索・意味などを調べれる。
 その他  

Canva Colors

関連記事

⑩ Sphere : Color Theory Visualizer

color-theory-visualizer

Sphere: Color Theory Visualizerは、
1つのカラーを選択することによって
簡単にカラーリングを表示できるサイト。

 特徴 ・ワンクリックで配色を見つけれるサイト
・パターンも沢山の選択できて
「Harmony」「Vision」「Quantize」を
 変更して様々なカラーリングが可能。
・「Adobe Color」と同じようなツール
 その他  

Sphere : Color Theory Visualizer

Harmonize colors. Create color schemes. Find HEX codes. Simulate color-blindness. Export into Illustrator, Photoshop and ColRD.com

まとめ

以上が、普段使い可能な便利な
カラーツール10選まとめでした。

なお、その他の無料カラーツールは
下の記事に一通りまとめています。

また、配色に関わる書籍・本は 
次の記事を参考にしてみてください。

スポンサーリンク

シェアする