カラー変換
カラーピッカー、ランダムカラー、ライブプレビュー、チャンネル調整、コピー可能な CSS 文字列を使い、1 つの色を 6 桁 HEX、RGB、HSL、CMYK の間でブラウザ内で変換します。
HEX
#
RGB
R
G
B
HSL
H
S
L
CMYK
C
M
Y
K
カラー変換6 桁 HEX または RGB/HSL/CMYK チャンネルを入力カラーピッカーかランダム色を使い、同期値を確認HEX、RGB、HSL、CMYK の CSS 文字列をコピー
かんたんスタート
1
2
3
よくある利用シーン
デザイン受け渡し
デザインの HEX を CSS の RGB/HSL に変換
スタイルガイド
コンポーネントの色表記と形式を統一
印刷参考
画面色を CMYK の初期見積もりとして変換し、最終値は校正と印刷ワークフローで確認します
アクセシビリティ
プレビューは簡易的な目視確認のみ。正確な比率は専用のコントラストツールで確認します
変換パラメータと表示
入力規則：HEX は 6 桁のみ対応（#RRGGBB、#RGB、#RGBA、#RRGGBBAA、アルファは非対応）。RGB は 0–255、H は 0–360、S/L は 0–100、CMYK は 0–100。入力は大文字小文字を区別しません
プレビュー：デスクトップは右側にライブプレビュー、モバイルはプレビュー非表示の軽量モード
カラーピッカー：各カード右上のパレットボタンで開きます
HEX の大文字ポリシー：出力は大文字に正規化（例 #1E90FF）、入力は大文字小文字を区別しません。切替はありません
微調整：チャネル文字を左右ドラッグ（Shift×10、Alt÷0.1）
コピー出力：コピーは標準化された文字列（HEX 大文字）を出力
使い方のヒント
精度：デバイス/アプリごとにカラーマネジメントが異なり、スポイト値がわずかに変わることがあります
アルファ：現行の形式はアルファ非対応。rgba()/hsla() などを使用
色空間：Web は sRGB が既定。P3/Display‑P3 では慎重に検証
チーム内の統一： CSS での正準形式（例：HSL）を取り決める
制限事項と互換性
デバイス差：モニター/ブラウザ/OS の色管理の違いにより見え方が異なることがあります
CMYK は近似値です。値は ICC プロファイル、紙、インク、デバイス、校正によって変わります。印刷可能な最終値ではなく参考として使用してください
アルファなし：このツールは透明度、rgba()、hsla()、#RGBA、#RRGGBBAA を処理しません
CSS カラーの一部のみ対応：名前付き色、transparent、currentColor、HWB、HSV/HSB、Lab、LCH、OKLab、OKLCH、Display-P3、device-cmyk()、相対色、color-mix()、contrast-color() は対象外です。
画像やパレットのツールではありません：画像サンプリング、画面スポイト、パレット生成、グラデーション生成、コントラスト比チェック、CSS 変数エクスポート、design token エクスポートは行いません。
プライバシーとセキュリティ
処理はブラウザ内で実行されます。現在の色、チャンネル値、出力設定、小数精度、大文字 HEX の設定、プレビュー設定、最近使った色のリストは、現在のブラウザセッションまたはブラウザストレージに残る場合があります。ワークスペースを保存するか WebDAV 同期を有効にした場合、現在の色と設定は同期設定に従って保存されることがあります。最近使った色は WebDAV では同期されません。HEX、RGB、HSL、CMYK 文字列は現在の色と設定から再計算され、個別の結果として保存されません。このページは画像を読み取らず、画面をサンプリングせず、URL を取得せず、サーバー側の変換のために色を送信しません。共有デバイスでは、必要に応じて色、設定、サイトデータを消去してください。
よくある質問
現在は未対応です。6 桁の HEX（#RRGGBB）をご利用ください。
RGB は 0–255（整数）。H は 0–360、S/L は 0–100%
CMYK は用紙、インク、デバイス、ICC 設定に依存します。ここでの値は近似値です。CMYK から HEX/RGB への変換は参照用に対応していますが、本格的な印刷には ICC プロファイルと校正が必要です。
現時点では非対応です。rgba()/hsla() か、別のアルファ値をお使いください。
カラーマネジメントやレンダリング、画面校正の差異によるものです。本ツールは sRGB 基準で計算しており、参考値です。
現在は sRGB ベースです。P3 または Display-P3 のワークフローでは、対象デバイス、ブラウザ、ICC プロファイルで確認してください。