HMI背景色に「黒」は危険!色弱でも見える最強のRGB設定値公開

  • URLをコピーしました!
\ 迷子にならないための地図 /

未経験から一人前への
「最短ルート」公開中

独学で「何から勉強すれば…?」と悩んでいませんか?
現場で戦える知識を、体系的にまとめました。

FA電気設計ロードマップを見る

まだその「黒い画面」を使いますか?実務9年のFAエンジニアとして断言しますが、その「黒背景」は現場の安全を脅かしています。

前回の記事で、「日本人男性の20人に1人(P型・D型色覚)」にとって、FA現場でも当たり前となっている「黒背景に赤文字」がいかに危険かをお伝えしました。

あわせて読みたい
黒背景の赤文字が読めない?現場の20人に1人が抱える色覚の恐怖 実務9年の現役エンジニアである私自身、色彩検定UC級を学ぶまで自分の「色覚特性」に気づいていませんでした。FA現場で常識の「黒背景に赤文字」が、実は20人に1人には「見えていない」という衝撃の事実とリスクを、実体験を交えて解説します。
  • 「黒背景の方がカッコいいから」
  • 「装置の汚れが目立たないから」
  • 「昔からの慣習だから」

そんな理由で選ばれている「黒背景」が、現場の安全を脅かしているのです。今回は、具体的な解決策となる「実践編」です。

結論から言うと、背景は「黒」ではなく「ライトグレー」が正解です。FA現場でそのまま使える具体的なRGB値をリスト化しました。 明日からあなたの設計する画面が変わります。ぜひブックマークしてご活用ください。

ただし、「黒がダメなら真っ白(ホワイト)にすればいい」と安易に考えると、今度は現場から「目がチカチカして疲れる!」とクレームの嵐になります。 なぜ「白」もダメなのか? その理由と、辿り着いた「最強のグレー」の数値を公開します。


目次

【NG例】「黒背景の赤」は、実は「黒」に見えている

私たちが普段見ている「黒背景に赤文字」のLED表示。P型色覚(1型)の方の目に、どう映っているか想像できますか?

「文字が消えています」

彼らにとって、赤色は私たちが思うよりもずっと「暗い色(黒に近い色)」として認識されます。つまり、「黒い背景」の上に「黒っぽい文字」が乗っている状態になるのです。

これでは、文字が背景に沈んでしまい、読み取ることは困難です。もしこれが「非常停止」のような重要情報だったら……。考えるだけでゾッとします。

【30秒で復習】P型とD型ってなんだっけ?

ここで少しだけ復習です。

  • P型(1型)色覚の特性(筆者のタイプ)
    • 特徴:「赤」を感じるセンサーが弱い。
    • 【症状】赤色が「黒く(暗く)」見えたり、くすんだ黄色に見えたりする。
  • D型(2型)色覚の特性
    • 特徴:「緑」を感じるセンサーが弱い。
    • 【症状】赤と緑の差が分からず、どちらも同じような「濁った黄色」に見える。

今回は、この両方の弱点をカバーできる「魔法のRGB値」を紹介します。

アプリで確認すると「くすんだ黄色」に見えることも

「赤は黒く沈む」と言いましたが、環境や色の成分によっては、スマホの色覚シミュレーションアプリを通すと、鮮やかな赤が「くすんだ黄色(暗い黄土色)」のように見えることもあります。

「黄色なら読めるのでは?」と思うかもしれません。 しかし、現場の制御盤の周りを見てください。

  • 油で汚れた金属フレーム
  • 薄暗い工場の環境光
  • 劣化したラベル

これらもまた、「くすんだ黄色〜茶色」をしています。 文字の色が、こうした「背景のノイズ」と同じ色になって埋もれてしまう。これが現場で起きる見落としの真実です。

緊急時に一瞬で判断が求められるFAの現場において、この配色は「凶器」と言っても過言ではありません。

【コラム】学校の「赤チョーク」が見えなかった理由

読者のみなさんは、学生時代にこんな経験はありませんでしたか?

  • 「先生が黒板に赤チョークで書いた文字が、全然読めなかった」
  • 「重要な公式ほど赤で書かれるから、そこだけノートに写せなかった」

実はこれ、今回のタッチパネルの問題と全く同じなんです。

昔の黒板(深緑色)は、色覚特性を持つ目には「黒い背景」に見えます。そこに、P型の人には「黒く見える赤チョーク」で文字を書く。

つまり、「黒い紙に黒いインクで書く」のと同じで、物理的に読めるわけがなかったのです。しかし現在、学校現場では「チョーク革命」が起きています。

日本理化学工業などの努力により、色覚特性の人でもハッキリ見える「蛍光朱色(ユニバーサルデザインチョーク)」が普及しているのです。

学校は「チョークの色」を変えて進化しました。次は、我々FAエンジニアが「画面の色」を変える番です。

ちなみに、これが「魔法のチョーク」です

色覚特性を持つ人でもハッキリ見える「ダストレスチョーク」。150円で買えるので、もし現場に黒板があるなら試してみてください。「これなら見える!」と感動されます。


【解決策①】背景色は「ライトグレー」がFAの最適解

では、背景をどう変えるべきか。「黒がダメなら、真っ白(#FFFFFF)にすればいいのか?」

答えはNoです。 FAの現場では、白すぎる画面も嫌われます。

理由:目が疲れるから(グレア現象)

オフィスと違い、工場の中は少し薄暗い場所も多いです。暗い環境の中で、強力なバックライトで光る「真っ白な画面」を見続けるのは、例えるなら「懐中電灯の光をずっと直視している」のと同じです。

これではオペレーターの目が疲れてしまい、別のヒューマンエラーを引き起こします。

目指すべきは、オフィスの書類のような「真っ白」ではなく、新聞紙やダンボールのような「落ち着いた明るさ」です。だからこそ、FAの最適解は「ライトグレー(明るい灰色)」なのです。


【解決策②】「赤・緑」禁止令。これからは「朱・青緑」を使え

背景が決まったら、次は文字やランプの色です。

ここでも、やりがちなNGがあります。

  • NG:原色の赤(R255, G0, B0)
    • P型の人には黒く沈んで見えます。
  • NG:原色の緑(R0, G255, B0)
    • D型の人には、赤と同じような黄色に見えて区別がつきません。

では、どうすればいいか?

学校のチョークと同じく、色彩検定UC級では「ユニバーサルデザインカラー(CUD推奨色)」が定義されています。

  • 赤(Red) → 「朱色(Vermilion)」:少し黄色(緑成分)を足してオレンジ寄りにする。
  • 緑(Green) → 「青緑(Blue Green)」:少し青色を足す。

こうすることで、P型・D型の人でも「黄色」と混同せず、ハッキリ色が分かれるようになります。


【保存版】コピペで使える「FA用・推奨RGB値リスト」

お待たせしました。明日からあなたの設計するタッチパネル(GT Designer3、VT Studioなど)のパレットに登録すべき、推奨RGB値のリストです。

これは、日本の事実上のスタンダードである「カラーユニバーサルデザイン推奨配色セット Ver.4(CUDO)」の公式数値を元に、FAで使いやすい色を抽出したものです。

▼【データ元】具体的な数値はこちら(無料)[ カラーユニバーサルデザイン推奨配色セット ガイドブック(PDF)]

用途 CUD色名 推奨RGB値 (R, G, B) 色見本 備考
背景色 明るいグレー (200, 200, 203) ■ 明るいグレー 公式の「Base Color」準拠。
眩しすぎず最適。
異常・停止 赤 (Red) (255, 75, 0) ■ 赤 (Red) 鮮やかな朱色。
P型の人にも「黒」に見えない。
正常・運転 緑 (Green) (3, 175, 122) ■ 緑 (Green) 青みがかった緑。
赤と区別がつきやすい。
注意・警告 黄色 (Yellow) (255, 241, 0) ■ 黄色(Yellow) ハッキリした黄色。
文字色としても優秀。
情報・青 青 (Blue) (0, 90, 255) ■ 青(Blue) 誰もが見分けやすい青。
補足・空色 空色 (Sky Blue) (77, 196, 255) ■ 空色(Sky Blue) 青と使い分ける場合はこちら。
文字色 黒・濃グレー (0, 0, 0)
または
(50, 50, 50)
■ 黒 (Black)
■ 濃グレー
基本は黒。
目が疲れる場合は「濃いグレー」推奨。

※RGB値は、CUD推奨配色セット ガイドブック(第2版)の数値を参照しています。モニターの輝度設定や保護シートの有無によって見え方が異なるため、必ず実機で視認性を確認してください。

理論武装】「なぜ配慮が必要か」を論理的に説明するために
具体的なRGB値は上のPDFで十分ですが、「なぜその色なのか」「どういうメカニズムで見えないのか」を上司や客先に説明するには、体系的な知識が必要です。説得材料(エビデンス)として、デスクに置いておきたい一冊です。

【ワンポイント】文字は「真っ黒」じゃなくてもいい

表では基本として「黒 (0, 0, 0)」を挙げていますが、長時間見る画面ではコントラストが強すぎて目が疲れることがあります。 その場合は、少しだけグレーに寄せた「濃いグレー (50, 50, 50)」を使ってみてください。

背景のライトグレーとの相性も良く、「ハッキリ見えるのに、目に優しい」という、プロっぽい仕上がりになります。


まとめ:配色は「センス」ではなく「数値」で決まる

「私にはデザインのセンスがないから」そんな言い訳はもう通用しません。

ユニバーサルデザイン(UD)の配色は、センスではなく「数値(RGB)」で決まっています。あなたが悩む必要はありません。ただ、この推奨数値を守ればいいだけです

それだけで、あなたの作る画面は「20人に1人」を含む、すべての作業者にとって安全なものに変わります。

次回は、いよいよ【最終回】です。

  • 色すら使えない状況(モノクロ印刷、単色の表示灯)
  • 色覚以外の要素(高齢者の視野、文字サイズ)

に対応するための、「形とレイアウト」の技術を解説します。色がダメなら、形で伝える。それが真のプロの仕事です。

あわせて読みたい
色に頼らず形で伝える!モノクロでも伝わるFA画面デザインの極意 【完結編】現場のマニュアルが白黒コピーだったら?色が使えない状況でも確実に伝わる「ダブルコーディング(色×形)」の技術、ISO/IEC規格アイコン、そして老眼対策まで。プロが教える「誰にでも伝わる最強のHMI画面設計」の極意です。

「FA現場のHMI設計」完全マニュアル(全4回)

「私にはセンスがないから」と画面設計を諦めていませんか? 本連載では、センス不要の「ロジック(理論)」と、20人に1人の色覚バリアフリーを解決する「ユニバーサルデザイン」の世界を解説します。

💬 更新情報を X (Twitter) で発信中!

記事の更新通知や、現場で役立つ「電気制御の小ネタ」をツイートしています。 また、「記事のここが分からなかった」「現場でここが困っているけどどうしたらいい?」といった疑問があれば、DMで募集しています!個別のトラブル相談も、ブログのネタにさせていただけるなら大歓迎です!ぜひフォローして気軽に絡んでください!

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

目次