「任意のカラーの組み合わせが問題無いかを確認できるOSSのシンプルなアクセシビリティチェックツール・「Colour Contrast Checker」」のご紹介| Webデザイン参考記事まとめアプデ

2020年12月14日(月)

任意のカラーの組み合わせが問題無いかを確認できるOSSのシンプルなアクセシビリティチェックツール・「Colour Contrast Checker」

0

2

1

8

Colour Contrast Checker

Colour Contrast Checkerは任意のカラーの組み合わせが問題無いかを確認できるOSSのシンプルなアクセシビリティチェックツールです。

任意の色のコントラストがWCAG2.0のガイドラインに沿っているかどうかをチェックしてくれます。判定は大きいサイズのテキストのAA及びAAA、通常サイズのテキストのAA及びAAAで、問題なければPass、問題あればFailと判定されます。カラーは手動で入力できるほかスライダーで調整も可能です。

他に反転したり任意のテキストでチェックしたりカラーコードをコピーしたり、気に入った気に合わせを記憶したりと、シンプルながら必要な機能がしっかり揃えられています。

本ツールはOSSとしてもソースコードが公開されています。ライセンスはMIT。

Colour Contrast CheckerOn Github

WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログかちびと.netの記事『任意のカラーの組み合わせが問題無いかを確認できるOSSのシンプルなアクセシビリティチェックツール・「Colour Contrast Checker」』についてまとめています。

気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のかちびと.netで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとかちびと.netの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。