概要 色変換
HEX · RGB · HSL · OKLCH · Lab · CMYK
使い方
HEX・RGB・HSL・HSV・CMYK のいずれかで色を貼り付けると、他のすべての形式でコピーできます。入力に合わせて変換結果がリアルタイムで更新されます。
色変換
どの色形式も同じものを別の言語で表しています。HEX はスタイルシート、RGB は画面とコード、HSL はパレット構築、CMYK は印刷向けです。必要な変換を選び、正確な値・ライブプレビュー・計算式を確認してください。
すべての変換
4 つの色形式
HEX とは?
HEX コードは赤・緑・青のチャンネルを 6 桁の 16 進数で保存し、先頭に # を付けます。2 桁ずつが 1 チャンネルで、00 から FF まで。RGB と同じ 1670 万色を短く表します。CSS、デザインツール、ブランドガイドの標準です。
#RRGGBB
CSS、デザイン受け渡し、ブランドガイド
RGB とは?
RGB は色を 3 つの光チャンネルで表し、それぞれ 0 から 255 です。画面の仕組みに対応し、すべて 255 で白、すべて 0 で黒になります。色を計算する場面に適し、rgba() で透明度を追加できます。
rgb(R, G, B)
コード、Canvas、rgba() の透明度
HSL とは?
HSL は色を色相(0–360°)、彩度(0–100%)、明度(0–100%)に分けます。人が色を説明する方法に近いため、トーンやシェード、一貫したパレットを手作業でもコードでも作りやすい形式です。
hsl(H, S%, L%)
パレット、トーンとシェード、テーマ
CMYK とは?
CMYK は印刷の 4 インクモデルで、シアン・マゼンタ・イエロー・キー(黒)をそれぞれ割合で表します。インクは光を減らすため、画面の鮮やかな色は印刷でくすんで見えることがあります。
cmyk(C%, M%, Y%, K%)
印刷、パッケージ、入稿データ