色覚シミュレーション（色の見え方）

指定した色が、P型・D型・T型の色覚の人や白黒印刷でどのように見えるかを色見本で表示します。配色の確認に。

元の色
-
P型（赤が見えにくい）
-
D型（緑が見えにくい）
-
T型（青が見えにくい）
-
白黒印刷
-

※ 強い色覚特性の場合の近似です。赤と緑、青と紫のように見分けにくい組み合わせがないか、文字や模様でも区別できるかを確認しましょう。

最終更新 2026-11-04

関連ツール

Web制作・SNS コントラスト比のチェック（WCAG） 文字色と背景色のコントラスト比を計算し、WCAG 2.x の AA・AAA 基準を満たすかを判定します。読みやすい配色の確認に。 Web制作・SNS カラーコードの変換（HEX・RGB・HSL） カラーコード（#1d4ed8）・RGB・HSL・色名を相互に変換し、色見本と、明るく・暗くした色も表示します。 Web制作・SNS box-shadow の作成 影のずれ・ぼかし・広がり・色・透明度を指定して、CSS の box-shadow を作成します。ふんわりした影のプリセット付き。 Web制作・SNS CSS clamp() の計算（レスポンシブな文字サイズ） 画面幅に応じて文字サイズなどを滑らかに変える CSS の clamp() を、最小・最大のサイズと画面幅から計算します。