// COLOR CONVERTER
カラーコード変換 HEX⇔RGB⇔HSL
カラーピッカーまたはコード入力で、HEX・RGB・HSLをリアルタイム相互変換。CSS用コードをワンクリックコピー。
カラーピッカー
HEX（16進数）
RGB
HSL
基本色から選ぶ
カラーコード変換ツールとは？
このツールは、HEX（16進数）・RGB・HSLのカラーコードを相互変換できる無料のオンラインツールです。カラーピッカーで色を選ぶか、コードを直接入力すると、3つの形式が同時に更新されます。Webデザイン（CSS）・画像編集・配色検討にそのまま使えます。
無料
HEX/RGB/HSL対応
カラーピッカー
ワンクリックコピー
インストール不要
HEX・RGB・HSLの違い
いずれも同じ色を別の方法で表しているだけで、相互に変換できます。
- HEX：
#RRGGBBの16進数表記。Web/CSSで最もよく使われます（例：#FF0000＝赤）。 - RGB：赤・緑・青を 0〜255 で表す表記（例：rgb(255, 0, 0)）。
- HSL：色相(0〜360°)・彩度(%)・明度(%)で表す表記（例：hsl(0, 100%, 50%)）。明るさや鮮やかさを直感的に調整できます。
使い方のヒント
HSLは色相(H)を固定したまま明度(L)を上下させるだけで、同系色の濃淡（シェード）を簡単に作れます。サイトの配色やボタンのホバー色を決めるときに便利です。
よくある質問
Q.HEX・RGB・HSLの違いは？
HEXは#RRGGBBの16進数表記、RGBは赤緑青を0〜255で表す表記、HSLは色相・彩度・明度で表す表記です。同じ色を異なる方法で表現しているだけで、相互に変換できます。
Q.カラーコードとは何ですか？
色をコンピュータで扱うための数値表記です。CSSや画像編集ソフトで色を指定する際に使われます。赤なら #FF0000、rgb(255,0,0) と表せます。
Q.HSLはどんなときに便利ですか？
明るさや鮮やかさを直感的に調整できるため、「同じ色相で少し明るく」といった配色調整に便利です。色相を固定して明度を変えるだけで濃淡を作れます。
Q.入力した色のデータは送信されますか？
いいえ。すべての変換はブラウザ上で行われ、データはサーバーに送信されません。