AHREFエンジニア・デザイナー向け無料ツールズ

カラーコード変換

オフライン対応版入力はブラウザ内だけで完結しプライバシーを守ります。

HEX・RGB・HSL・CMYK を、ブラウザ内だけで相互変換します。カラーパレット・Webセーフ限定・スポイト対応。入力はサーバーに送りません。

各数値を入力し、「変換」で他形式へ変換します。

HEX※

RGB※

HSL※

CMYK※

プレビュー

未設定

使い方

  1. 色を選ぶ：カラーパレット・スポイト、または HEX（RR/GG/BB）・RGB・HSL・CMYK の各数値欄に値を入れます。
  2. 変換する：「変換」ボタン（または Enter）で他形式へ反映します。パレット・スポイトは選んだ時点で反映されます。
  3. 結果を確認する：他形式への変換結果と色プレビューを確認します。
  4. コピーして使う：必要な形式をコピーボタンで取得します。不正な入力はエラーとして表示します。

カラーコード変換とは

カラーコード変換は、Web や印刷で使う色表記（HEX・RGB・HSL・CMYK）を相互に変換し、プレビューするツールです。カラーパレットやスポイトで色を選ぶか、各形式の数値を入力して「変換」すると他形式へ反映します。処理はこのブラウザ内だけで行い、入力はサーバーに送信しません。CMYK は一般的な近似式による変換であり、印刷機固有のプロファイルは扱いません。

よくある質問

データはサーバーに送られますか？

送りません。変換はこのブラウザ内で行います。通信を切った状態でも使えます。

CMYK は正確ですか？

一般的な RGB↔CMYK の近似式で計算します。印刷所の ICC プロファイルや特色は扱いません。デザイン確認用としてご利用ください。

どの HEX 形式に対応していますか？

#RGB と #RRGGBB（大文字・小文字、# の有無どちらも可）に対応します。アルファ付きは対象外です。

Webセーフカラーとは？

各 RGB チャンネルが 0 / 51 / 102 / 153 / 204 / 255 のいずれかになる 216 色です。ON にすると入力・パレット・スポイトの結果を最も近い Webセーフ色へ量子化します。

スポイトが使えません

ブラウザの EyeDropper API に依存します。未対応のブラウザではボタンが無効になり、代替経路への黙った切り替えは行いません。Chrome / Edge など対応ブラウザでお試しください。

カラーコードの種類

HEX（16進カラーコード）

Web で最も一般的な色の書き方です。赤・緑・青をそれぞれ 00〜FF（0〜255）の 16 進数で表し、#RRGGBB の形で書きます。#RGB の短縮形（例: #F00 = #FF0000）にも対応します。CSS やデザインツールの指定によく使われます。アルファ（透明度）付きは本ツールの対象外です。

RGB（加法混色）

ディスプレイの光の三原色（Red / Green / Blue）を 0〜255 の整数で表す方式です。値が大きいほどその色の光が強くなり、すべて 255 で白、すべて 0 で黒になります。CSS の rgb(r, g, b) や画像・UI の色指定の基本単位です。本ツールでは不透明な 3 チャンネルのみを扱い、rgba のアルファは受け付けません。

HSL（色相・彩度・輝度）

色を「色相 H（0〜360°）」「彩度 S（0〜100%）」「輝度 L（0〜100%）」で表す方式です。色味を変えずに明るさだけ調整するなど、直感的な調整に向いています。CSS の hsl(h, s%, l%) として使えます。本ツールでは hsla のアルファは対象外です。

CMYK（減法混色・印刷向け）

印刷のインキ四色（Cyan / Magenta / Yellow / Key=黒）を 0〜100% で表す方式です。紙の上で光を吸収して色を作る減法混色です。本ツールの RGB↔CMYK は一般的な近似式による変換であり、印刷所の ICC プロファイルや特色は扱いません。デザインの目安確認用としてご利用ください。

関連ツール