最近cssファイルを作成したり修正したりする機会が多いのですが、色を色名で設定するときに不思議に思ったことです。

データのない箇所をグレーに塗りつぶすのにcssで「gray」を設定していたのですが、ちょっと暗いなと思って頭に「light」をつければ明るくなるだろうという発想のもと「lightgray」と入力してみました。

ところが、エディターで編集していたのでカラーチャートで設定されている色ならば強調表示になるはずなのですが、「lightgray」は強調表示にはなりません。

おかしいなと思ってカラーチャートを見てみると、そこには「lightgrey」と記載されています。

誤記じゃないのと半信半疑でしたが、とりあえずCSSに入力した綴りを変更してみるとちゃんと強調表示に変わりました。

よくよく見てみると○○グレーという灰色のバリエーションがいくつかありますが、グレーの綴りは「gray」なのにライトグレーは「lightgrey」と綴ります。

グレーの中でも「grey」と綴るのはこの「lightgrey」だけです。

日本ではたいてい小中学校の英語の授業ではアメリカ英語を使用するので、「grey」綴りには違和感がある人が多いのではないでしょうか。

なぜ、grayとgreyが混在してしまったのかをネットで調べたのですが、アメリカ由来の色名とイギリス由来の色名があるからとしか分かりませんでした。

引き続き調べたいと思いますが、ご存知の方がいたら教えてください。

o