2015/05/22
アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかる「Colors」

アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかるWEBサイトをご紹介します。
WEBデザインで重要なアクセシビリティ。
そのアクセシビリティに基づいたWEBサイト用のカラーと、その配色例がすぐにわかったら便利ではないですか。
今回ご紹介するサイトがまさにそれ。
このサイトがあれば、すぐに目的のカラーや配色を見つけて、自分のデザインに活用できるはず。
WEBデザインの配色のご参考になれば幸いです。
アクセシビリティを考慮したWEBカラーがまとめられた「Colors」
「Colors」はアクセシビリティを考慮したWEBカラーがまとめられたWEBサイトです。
カラーは16色。
HEX値だけでなく、CSSでクラス名だけですぐに利用できるCSSファイルのほか、sass、lessファイルなどもダウンロード可能です。
IllustratorやPhotoshopでも利用できるパレットもダウンロードできます。
「Colors」の配色例90がわかる「A11Y」
上記「Colors」は基本の18色だけでしたが、その基本色を組み合わせた90の配色例も提示されています。
同じ「Colors」サイト内にある「A11Y」というページです。
下記はその配色例の一部です。
大変参考になるのが、コントラストが具体的な数値で表示されている点です。
当然、数値が高いものほど、コントラストが強くなります。
これはすごく参考になりますね。
Sponsored by
お役に立てましたら、以下どれでも結構のですので、ポチリと……。
Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。
この記事を読んだ人はこんな記事も読んでいます
-
-
CSS3の色名147色(RGB、HEX16進カラーコード併記)
CSS3になって、色名についても大幅に選択肢が増えたのをご存知でしょうか。 私は知りませんでした。
-
-
Photoshopで明度を調節できるスクリプト「Lighten / Darken Color」で効率アップ
Photoshopでカラーの明度を簡単に調節できるスクリプトが便利だったのでご紹介。 「描画色」を
-
-
2015年秋冬の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介!国際見本市SpinExpo発表の流行色・トレンドカラー
SpinExpoが2015年秋冬の流行色・トレンドカラーを発表しましたので、いち早くご紹介します!
-
-
PANTONEカラー検索・変換の決定版ツール「Find a PANTONE Color」でRBG、CMYK、HEX変換が一瞬になった
PANTONEカラー検索・変換の決定版ツール「Find a PANTONE Color」をご存知でし
-
-
この配色は美しい!ウェス・アンダーソンの映像美を支える配色/カラーパレットを解析した「Wes Anderson Palettes」
類まれなセンスで映画をつくるウェス・アンダーソン監督。 その独特な感性で表現される世界観は多くの人
-
-
効果的な配色を!実践で使えるカラーパレット100
カラー・色は、あらゆる人の人生においてもっとも重要な要素の1つではないでしょうか。 特にデザイン領
-
-
2016年春夏の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介!国際見本市SpinExpo発表の流行色・トレンドカラー
SpinExpoが2016年春夏の流行色・トレンドカラーを発表しましたので、CMYK/RGB/HEX
-
-
スタイリッシュで洗練されたスイススタイルのカラー・配色を利用できる「Swiss Style Color Picker」
スタイリッシュで洗練されたスイススタイルのカラー・配色を利用できるカラーピッカーをご紹介。 スイス
-
-
2016年秋冬の流行色・トレンドカラーをCMYK/RGB/HEXで!国際見本市SpinExpo発表の流行色・トレンドカラー
SpinExpoが2016年秋冬の流行色・トレンドカラーを発表しました。 デザインや商品企画などで
-
-
Illustratorでのカラーワークで役立つ無料のカラースウォッチライブラリー12
デフォルトのIllustratorはスウォッチパネルがほぼ空状態です。 これは具合が悪い。 いち