
カラーチャート
色見本は色を知るだけでなくトーンや色相による色の変化を見るのにも便利。色で迷ったときには、見た感覚でこれだっ!て決めると良い色がチョイスできます。頭で考えるより直感が大切な場合も多々あるのが色の魅力です。
色の組み合わせによるイメージをカラーチャートから掴もう。WEBデザインでは16進方表記、モニター表示にはRGB。印刷用にはCMYK。カラーチャートを用途別に使えるように複数の数値を表記しているので便利です。ベースはCMYKを基準に作成しています。
利用頻度の高そうな配色や実際に仕事でよく使っている色の組み合わせなどの配色も紹介。
カラーシステム色相環チャート
色の違う色相を円形に並べたものを色相環といいます。これにより色の関係が分かります。ぶつかり合う反対色や調和のとれる類似色などの色の関係が色相環から判断できます。

12色の色相環チャート:純色12色の色相環チャート。CMYで100%と50%の掛け合わせを基準にして作成。

24色の色相環チャート:純色12色とその中間色の色相環チャート。CMYで100%と50%と25%の掛け合わせを基準にして作成。
カラーチャート
色が混ざっていくとどう変化していくかの確認に便利です。色別に0%〜100%まで10%きざみの階調のチャートになっています。
CMYKのプロセスカラーを基準に作成したカラーチャート
CMYKの色:印刷で主に使われるカラーモードのCMYKで作れる色。
トーン別の色相カラーチャート:色調ごとに色相をまとめたイメージカラーチャートです。
色別の明度・彩度のカラーチャート:色別に明度・彩度の階調を表した色サンプル。
ランダムカラーチャート:迷ったときの神頼み色見本。
配色
2色以上色を組み合わせて色にイメージや効果を持たせることができます。いい組み合わせを見つけて色を効果的に表現しましょう。 カラーチップでCMYKとweb16進数の数値が分かります。色と色の組み合わせの見栄えを確認することが出来ます。
色の配色のコツ:色の組み合わせの参考になる身近なお手本とはなにか。
言葉から表現する配色:色カラーでストックしておきたい色の組み合わせと色見本を作ろうのページで登録された配色をまとめたもの。
色見本を作ろう:配色と言葉を結び付け。サイト訪問者参加型のカラーチャート。
配色イメージサンプル特集:利用度の高い・もしくは興味をそそる色の組み合わせを特集。
WEBカラーチャート
HTMLで定義されている基本216色。Webページを作成するときに指定できる色のうち、256色環境でも再現される色でWEBセーフカラーといいます。MACとWINでの256色の色が少し違うので両方で大丈夫な216色が基本色となっています。WEBセーフカラーはRRGGBBで表記され、各値を16進数(0〜F)で表現し、[00
33 66 99 CC FF ]の組み合わせから成ります。R・G・Bに各6色で6×6×6=216色です。古いブラウザや携帯でも安心な色です。モニターで色の区別をはっきり付けたいときはこの色の中からチョイスしましょう。
WEB利用をベースとしたカラーチャート・webセーフカラー
WEBサイトのカラーチャート
いろんなwebサイトで使用されている色拾い出してカラーチャートを作成しました。色使いの参考に活用できます。
WEBサイトカラーチャート

新着記事・NEWページ
色の人気記事
技とコツと豆知識
- どこまでセーフ?印刷解像度
- DTPデザインの基本のルール
- 仕事としてデザインするとき意識したい10のスキル
- WEBデザインのコツ:SEOに有効なURLの名前の付け方
- 用紙サイズ一覧
- ロゴマークの作り方





