日立製作所は、WebサイトやWebブラウザを活用した業務システムにおいて、「Cascading Style Sheets」(以下、CSS)の追加仕様である「CSS Level 3」(以下、CSS3)に対応した「画面の色作成支援ツール」を開発し、Webサイト上で無償公開している。無償公開は期間限定で、公開期間は2012年7月23日～2013年7月19日までとなっている。

同ツールは日立グループのデザイン部門であるデザイン本部と日立公共システムエンジニアリングの共同研究により開発されたもので、デザイナーの色覚特性によらずガイドラインに沿ったWebデザインを実現するという

近年、WebサイトやWebブラウザを活用した業務システムの画面デザインでは、多様な表現が可能になった一方で、アクセシビリティに対する配慮が課題になっているという。

例として、画面上のボタンに影やグラデーションなどの立体感のあるデザインをする場合、CSS3での制作が可能ではあるものの、従来のCSSに比べ複雑な規定であるため、画像で作成したボタンを読み込ませる方法のほうが手間がかからない。だが、W3Cが規定しているアクセシビリティのガイドラインWCAG(Web Content Accessibility Guidelines) 2.0やJIS規格においては、画像を読み込ませる方法だと、色や大きさなどをカスタマイズすることが難しいため、できる限り使用しないよう推奨されている。

それ以外にも、音声読み上げソフトウェアなどをインストールしているPCの場合、適切な代替テキストが書かれていない画像では、前述のボタンのような画像について、そのまま「画像」と読み上げてしまうなどの問題が生じているという。

同ツールは、Webデザイナーやシステム開発者が直面しがちな問題を解決し、アクセシビリティを考慮したCSS3対応のページ制作を支援する。色覚特性に依存せずに識別可能な色の選択を行えるので、より多くの人に見やすい画面の作成が可能となり、文字と背景の色をそれぞれ一色で指定する場合にはWebのアクセシビリティ規格「JIS X 8341-3」に準拠しているかどうかを確認しながら色を選択することができる。

また、背景の色をグラデーションにしたり、文字に影を付けるような場合、ガイドラインに記された文字:背景の輝度比に則った色選択は困難だったが、輝度比近似グレースケールを用いることで、識別可能な色が容易に選択できるとのことだ。

なお、Firefox12.0以降でのみ動作が確認されているため、その他のブラウザでは動作せず、警告ページにリダイレクトされるので、利用の際は注意してほしい。