カラーを指定すると、その色に対してアクセシビリティ的に問題ないカラーを提案してくれる・「Accessible Color Generator」

Ads

Accessible Color Generator


Accessible Color Generatorは任意のカラーを指定すると、その色に対してアクセシビリティ的に問題ないカラーを提案してくれるWebアプリです。提案してくれるのは白いテキストを使う場合に指定したカラーに最も近いカラーでアクセシビリティレベルがAA或いはAAAをクリアしてくれるカラー、同じ条件でグレーのテキストを使う場合はグレーに近いテキストで条件をクリアできるカラーを提案、同系色で条件をクリアできるカラーの3種を提案してくれます。

Ads

使ってみる


試しに#61e7ffでテストしました。(この色への直接リンクも可能です)

#fffなテキストを使うのであれば近い色合いの#00a3ba#008299を使えばクリアできるそうです。また、背景に使い、テキストをグレー系にする場合は#787878#5b5b5bなどより濃ければOK、同色系は#008299#00657aならクリアできる、との回答でした。

色の指定は複数可能となっており、利用も無料でユーザー登録も要らないので最終的なチェックの際に試してみるなどアクセシビリティチェックの1つとして覚えておくと良いかもしれませんね。

Accessible Color Generator