カラーコード 変換 — コントラスト計算も同じ画面で
JavaScriptを有効にしてください。計算はブラウザの中で行います。
印刷用の値ではなく出発点として見てください。ブラウザには印刷機や紙のプロファイルがないので、ウェブページが出すCMYKは式であって一致ではありません。実際に刷るなら変換は印刷所に任せてください。
コントラスト
- 白地 —
- 黒地 —
二色目との比
比 —
カラーコード 変換について
色の変換は算数で、そこで終わってしまうページがほとんどです。本当に要る数字はたいていその次にあります — この色の上で文字が読めるのか。
このページは両方をやります。HEX・RGB・HSLがどちらの向きにも編集でき、同時にコントラスト比が計算されます。白地に対して、黒地に対して、そして指定した二色目に対して。色がムードボードではなく実際の画面に入るときに出てくる問いはこの三つです。
一つだけ意図して留保しています。CMYKは出しますが近似だと書きます。ブラウザには印刷機も紙もプロファイルもないからです。正確なCMYKを渡すページは、式を渡して一致と呼んでいるのです。
計算はすべてここで終わります。入力した値は送信されず、タブを閉じれば消えます。
貼り付けられる値を得る手順
- すでに手元にある値をその欄に打ってください。デザインファイルのHEXでも、キャプチャツールのRGBでも、手で調整中のHSLでも、残りの二つがすぐ追従します。
- 変換ではなく選んでいる最中ならピッカーを使ってください。同じ欄に入るので他の表記もそろいます。
- コピーする前に見本を二つとも見てください。いま作っている画面で良く見える色が、逆の地色で崩れる色であることは珍しくありません。
- 実際に使う組み合わせを二色目に入れてください。白地ではなく本当の背景色との比が、アクセシビリティの検査が見る値です。
- 基準線をわずかに下回るときは色相ではなく明度を動かしてください。たいていLを数ポイント動かすだけで、選んだ色を変えずに越えられます。
よくある質問
無料ですか。登録は必要ですか。入力した値はどこかへ送られますか。
無料で、登録も要らず、送信もありません。変換もコントラストの計算もこのブラウザの中で終わり、タブを閉じれば消えます。色の履歴も残らないので、残したい値はコピーしておいてください。
CMYKはなぜ近似と書いてあるのですか。
正確な変換には印刷機とインクと紙を知る必要があり、ブラウザはどれも知りません。ウェブページにできるのは標準の式を当てることだけで、それは使える出発点ではあってもそれ以上ではありません。実際に刷るものなら、変換は刷る側の仕事です。
コントラストはいくつあればいいのですか。
よく使われる基準線は本文4.5、大きい文字3.0で、このページは打つそばから両方を表示します。その数字は私たちが決めたものではなくアクセシビリティ指針の値で、越えることは目標ではなく床です — 4.6の文字は基準を満たしていても読み疲れます。
二回変換したらHSLの値が少しずれました。
不具合ではなく丸めです。HSLはRGBの数字から導かれ、行き来のたびに整数に落ちるので末尾が1動くことがあります。保管する値は最初のHEXで、HSLは保存用ではなく調整用と考えてください。
色覚テストや色彩感覚テストとは何が違いますか。
あちらは色をどう見えているかを測り、こちらは色がどう書かれるかを変えます。色覚のスクリーニングも色彩感覚の判別も図版や格子を出して点を付けますが、このページに点はありません。値ではなく目のほうを確かめに来られたのなら、そちらへどうぞ。
特定ブランドの色見本の番号も分かりますか。
分かりません。それらの体系は商標で値もライセンスの対象なので、表として載せていません。ここにあるのはHEX・RGB・HSLのあいだの公開された算数で、画面に載るものならそれで足ります。