アクセシビリティカラーヘルパー - Webアクセシビリティを考慮した色を提案 // MOONGIFT Archived

Webのアクセシビリティは大事な考え方です。誰もが使いやすいWebサイトを目指す上で、文字の大きさや背景色とのコントラスト、リーダー対応など様々な観点があります。今回紹介するアクセシビリティカラーヘルパーは背景と文字のコントラスト比を維持するためのカラーパレットになります。

アクセシビリティカラーヘルパーの使い方

利用しているところです。背景色を選んで、その色と指定したコントラスト比以上の色を提案してくれます。

緑系の場合、コントラスト比が9.97だそうです。

背景色を明るくしたり（逆に暗くしたり）、コントラスト比を高くすれば選択できる色数は減ります。

見やすさだけを考えれば白と黒が最もコントラスト比が高い状態になるでしょう。しかしデザインや装飾を考える上で色を選択する必要があります。そんな時の一助になるでしょう。カラーテーマなどを考える際にも参考になりそうです。

アクセシビリティカラーヘルパーはJavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。