個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

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

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

アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかるWEBサイトをご紹介します。
WEBデザインで重要なアクセシビリティ。
そのアクセシビリティに基づいたWEBサイト用のカラーと、その配色例がすぐにわかったら便利ではないですか。
今回ご紹介するサイトがまさにそれ。
このサイトがあれば、すぐに目的のカラーや配色を見つけて、自分のデザインに活用できるはず。
WEBデザインの配色のご参考になれば幸いです。

アクセシビリティを考慮したWEBカラーがまとめられた「Colors」

「Colors」はアクセシビリティを考慮したWEBカラーがまとめられたWEBサイトです。
カラーは16色。

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

HEX値だけでなく、CSSでクラス名だけですぐに利用できるCSSファイルのほか、sass、lessファイルなどもダウンロード可能です。

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

IllustratorやPhotoshopでも利用できるパレットもダウンロードできます。

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

「Colors」の配色例90がわかる「A11Y」

上記「Colors」は基本の18色だけでしたが、その基本色を組み合わせた90の配色例も提示されています。
同じ「Colors」サイト内にある「A11Y」というページです。
下記はその配色例の一部です。

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

大変参考になるのが、コントラストが具体的な数値で表示されている点です。
当然、数値が高いものほど、コントラストが強くなります。
これはすごく参考になりますね。

Colors
A11Y

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 0
  • 6

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

色彩検定2級に短期期間で合格できるオススメ問題集・参考書2冊

あなたは今年の目標を立てましたか? 資格試験合格の目標を立てている人はたくさんいますよね。 この

記事を読む

カラーを遊べ!16進数のカラーコードのイベンダーゲームでHEX博士だ

カラーを遊べ!16進数カラーコードのイベンダーゲームでHEX博士だ

16進数カラーコードいわゆるHEXをイベンダーゲームで楽しみながら学べる「Hex Invaders」

記事を読む

効果的な配色なら!実践で使えるカラーパレット100

効果的な配色を!実践で使えるカラーパレット100

カラー・色は、あらゆる人の人生においてもっとも重要な要素の1つではないでしょうか。 特にデザイン領

記事を読む

2017年秋冬の流行色・トレンドカラー! 国際見本市SpinExpo発表の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介

2017年秋冬の流行色・トレンドカラー! 国際見本市SpinExpo発表の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介

SpinExpoが2017年秋冬の流行色・トレンドカラーを発表しましたので、ご紹介します。 Spi

記事を読む

この配色は美しい!ウェス・アンダーソンの映像美を支える配色/カラーパレットを解析した「Wes Anderson Palettes」

類まれなセンスで映画をつくるウェス・アンダーソン監督。 その独特な感性で表現される世界観は多くの人

記事を読む

PANTONE color to the year 2015はMarsalaに!過去のPANTONE color to the yearのクイズも

PANTONE color to the year 2015はMarsalaに!過去のPANTONE color to the yearのクイズも

PANTONE color to the year 2015はMarsalaって色に決まりました。

記事を読む

ブラウザ上で、色・カラーをすばやく分析・変換してくれるChrome機能拡張「Colorpeek」

Chrome機能拡張で色・カラーの分析・変換をすばやく行ってくれる「Colorpeek」が便利だった

記事を読む

配色が苦手な人必見!違和感のある配色を良い感じのカラーパレットに直してくれる「Cohesive Colors」

配色が苦手な人必見!違和感のある配色を良い感じのカラーパレットに直してくれる「Cohesive Colors」

配色が苦手でも、まとまりのある良い感じのカラーパレットに直してくれるサービスをご紹介します。 便利

記事を読む

ポケモンのキャラからカラーパレットを生成できる「pokepalettes」

ポケモンのキャラからカラーパレット/配色を生成できる「pokepalettes」

ポケモンのキャラからカラーパレット/配色を生成できる「pokepalettes」をご紹介。 ポケモ

記事を読む

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

ズボラな自分に最適なCSSグラデーション作成ツールがあったので、ご紹介します。 グラデーションを自

記事を読む