はしくれエンジニアもどきのメモ

情報系技術・哲学・デザインなどの勉強メモ・備忘録です。

カラーユニバーサルデザイン(CUD)のメモ

カラーユニバーサルデザイン(CUD)のメモ

カラーユニバーサルデザイン(CUD)のメモ. 現在の最新版であるCUD Version 4 第2版についてのメモである.

カラーユニバーサルデザイン(CUD)とは

人間の生まれつきの色の感じ方(色覚)は、大きく5つの型(タイプ)に分けることができそれぞれの色覚型には色の感じ方に異なる特徴があります。また色覚は病気や老いによって変わることもあります。

こうした人間の色覚の多様性に配慮し、より多くの人に利用しやすい配色を行った製品や施設・建築物、環境、サービス、情報を提供するという考え方を「カラーユニバーサルデザイン(略称CUD)」と呼びます。

引用:ホーム » CUDとは, NPO法人 カラーユニバーサルデザイン機構

カラーユニバーサルデザイン推奨配色セット(CUD version 4 第2版 )

参照: ホーム » CUDとは » カラーユニバーサルデザイン推奨配色セット, NPO法人 カラーユニバーサルデザイン機構

:
ベース
色名表示日塗工色表番号マンセル値CMYKRGBHEXhsl(in css)
明るいピンク
 
rgb(255,202,191)##FFCABFhsl(10,100%,87%)
クリーム
 
rgb(255,255,128)#FFFF80hsl(60,100%,75%)
明るい黄緑
 
rgb(216,242,85)#D8F255hsl(70,86%,64%)
明るい空色
 
rgb(191,228,255)#BFE4FFhsl(205,100%,87%)
ベージュ
 
rgb(255,202,128)#FFCA80hsl(35,100%,75%)
明るい緑
 
rgb(119,217,168)#77D9A8hsl(150,56%,66%)
明るい紫
 
rgb(201,172,230)#C9ACE6hsl(270,54%,79%)

アクセント
色名表示日塗工色表番号マンセル値CMYKRGBHEXhsl(in css)
 
rgb(255,75,0)#ff4b00hsl(18,100%,50%)
黄色
 
rgb(255,241,0)#fff100hsl(57,100%,50%)
 
rgb(3,175,122)#03AF7Ahsl(162,97%,35%)
 
rgb(0,90,255)#005AFFhsl(219,100%,50%)
空色
 
rgb(77,196,255)#4DC4FFhsl(200,100%,65%)
ピンク
 
rgb(255,128,130)#FF8082hsl(359,100%,75%)
オレンジ
 
rgb(246,170,0)#F6AA00hsl(41,100%,48%)
 
rgb(153,0,153)#990099hsl(300,100%,30%)
 
rgb(128,64,0)#804000:hsl(30,100%,25%)

無彩色
色名表示日塗工色表番号マンセル値CMYKRGBHEXhsl(in css)
 
rgb(255,255,255)#FFFFFFhsl(0,0%,100%)
明るいグレー
 
rgb(200,200,203)#C8C8CBhsl(240,3%,79%)
グレー
 
rgb(132,145,158)#84919Ehsl(210,12%,57%)
 
rgb(0,0,0)#000000hsl(0,0%,0%)

画面用 推奨配色例 比較的見分けやすい組み合わせ

アクセント x ベースカラー

  • オレンジ, 黄色, 青, 茶色, 明るい緑, 明るい空色
  • オレンジ, 緑, 空色, 茶色, 明るいピンク, クリーム
  • オレンジ, 緑, 茶色, 明るいピンク, クリーム,明るい空色
  • オレンジ, 緑, 茶色, 明るいピンク, クリーム,明るい紫
  • オレンジ, 青, 空色, 茶色, 明るいピンク, クリーム
  • オレンジ, 青, 茶色, 明るいピンク, クリーム,明るい空色
  • オレンジ, 青, 茶色, 明るいピンク, クリーム,明るい紫
  • オレンジ, 青, 茶色, クリーム,明るい緑, 明るい空色

Photoshop CC でのスウォッチ(.aco)

Photoshop CCで使えるスウォッチ(.aco)を作成した.

スウォッチ

GitHub