カラーコード変換
色のカラーコードをHEX・RGB・HSLの各形式で相互に変換できます。カラーピッカーで色を選ぶだけで各コードを取得でき、Webデザインやコーディングに便利です。
入力内容をサーバーに送信しません▾
入力した内容は端末の中だけで処理されます。入力・貼り付けた内容は、お使いのブラウザ（端末）の中だけで処理されます。サーバーへ送信・保存されることはないため、パスワードや個人情報、社内の文章なども安心してご利用いただけます。
#F97316rgb(249, 115, 22)hsl(25, 95%, 53%)カラーコード変換とは
色のカラーコードをHEX・RGB・HSLの各形式で相互に変換するツールです。カラーピッカーで色を選ぶか、HEXコードを入力するだけで各形式のコードを取得できます。WebデザインやCSSのコーディングに便利です。
こんなときに便利
- WebデザインでHEXとRGBを変換したいとき
- CSSに使う色コードを調べたいとき
- 配色を微調整したいとき
使い方
- カラーピッカーで色を選ぶか、HEXコード（例: #f97316）を入力します。
- HEX・RGB・HSLの各コードが自動で表示されます。
- 使いたい形式の「コピー」ボタンで取得します。
詳しく知る
HEX・RGB・HSLの違いと使い分け
- HEX（#RRGGBB）：Webでもっとも一般的。赤・緑・青をそれぞれ00〜FFの16進数で表す。
- RGB：赤・緑・青を0〜255の10進数で表す。透明度を加えたRGBAもある。
- HSL：色相（Hue）・彩度（Saturation）・明度（Lightness）で表す。「同じ色味で少し明るく」といった直感的な調整がしやすい。
同じ色を別の表記で扱う
たとえば #FF8800 は RGB(255, 136, 0)、HSL(32, 100%, 50%) と、どれも同じオレンジ色を指します。デザインツールはHEX、CSSのアニメーションやテーマ設計ではHSLが扱いやすいなど、場面によって便利な表記が変わります。このツールはカラーピッカーで選んだ色を3形式に同時変換するので、必要な形式をすぐコピーできます。
他のサイトとの違い
| べんりや | 一般的な他サイト | |
|---|---|---|
| 料金 | 完全無料（回数制限なし） | 無料〜有料・回数制限あり |
| 会員登録 | 不要 | 必要な場合あり |
| 入力内容の扱い | 端末内で処理（サーバー送信なし） | サーバーへ送信される場合あり |
| インストール | 不要（ブラウザで完結） | アプリが必要な場合あり |
| 広告 | 控えめ | 多い場合あり |
※ 一般的な他サイトの傾向をまとめたもので、すべてのサービスに当てはまるものではありません。
よくある質問
HEXコードはどんな形式で入力できますか？
「#f97316」または「f97316」のように、6桁の16進数で入力できます。
HSLとは何ですか？
色相(H)・彩度(S)・明度(L)で色を表す形式です。色味の微調整がしやすいのが特徴です。
会員登録やアプリのインストールは必要ですか？
いいえ。会員登録もインストールも不要です。このページをブラウザで開くだけで、すぐに無料でお使いいただけます。
料金はかかりますか？利用回数の制限はありますか？
いいえ。べんりやのツールはすべて無料で、利用回数の制限もありません。何度でもお使いいただけます。
入力した内容はサーバーに送信・保存されますか？
いいえ。入力した内容はお使いのブラウザ（端末）の中だけで処理され、サーバーへ送信・保存されることはありません。
スマートフォンでも使えますか？
はい。スマートフォン・タブレット・パソコンのいずれのブラウザでもご利用いただけます。