このツールに問題がありますか?

「HEXからRGBへの変換 オンライン」について

このツールは hex(#FF5733)と RGB(rgb(255, 87, 51))の表記を相互変換します。同じ色を表しますが、CSS では hex が簡潔、プログラム的にスライダーを扱うときは RGB が読みやすい、と用途で使い分けます。

6 桁 hex(#FF5733)、3 桁省略形(#F53 = #FF5533)、アルファ付き 8 桁 hex(#FF5733FF)に対応。出力は rgb() に加え、モダンな rgb(r g b / a) も提供。

ツール間のデザイン移行(Figma の hex をコードでは rgb で使う)、CSS の見た目差分のデバッグ、両形式に対応するツール開発に便利。

このツールの使い方

hex カラーを RGB に変換する手順

  1. hex コードを入力

    「Hex (#RGB or #RRGGBB)」欄に hex 値を。先頭の `#` は任意で大文字小文字は無視 — `#FF00aa` も `ff00aa` も同じ。

  2. 3 桁ショートハンドの自動展開

    3 桁 hex は各桁を 2 倍に展開:`#abc` はパース前に `#aabbcc` に。3 桁・6 桁以外の長さは明示エラーで拒否されます。

  3. 「実行」

    結果は `r`, `g`, `b`(各 0〜255)、`rgbCss`(コピペ可能な `rgb(r, g, b)` 文字列)、`hex`(正規化された 6 桁小文字形式)。

  4. rgbCss をそのまま使う

    rgbCss はブラウザの inline スタイルが期待する書式そのまま。スタイルシート、デザインツール、コンポーネントの prop に手直しなしで貼れます。