HEX → RGB
16進数のカラーコードをRGBとHSLに変換します。
このツールはJavaScriptで動作します。使うには、ブラウザでJavaScriptを有効にしてページを再読み込みしてください。
#HEX から RGB へ、すぐに。
HEX → RGB は、十六進数のカラーコードを RGB と HSL の値に変換します。コードは番号記号つきでも、なしでも書けます。三桁の短い形（#f00）、六桁の標準の形（#ff0000）、透明度を含む八桁の形（#ff0000cc）に対応しています。書いた瞬間に色のプレビューが更新され、結果が出ます。RGB、透明度があれば RGBA、HSL、そしてスタイルシートにそのまま貼れる CSS 変数です。
結果の一覧は、この色の上に暗い文字と明るい文字のどちらを置くべきかも教えます。この助言は色の見かけの明るさから計算されます。必要なら色の選択から色を選んでそのコードを得ることもできます。ツールは両方向に働きます。RGB の欄を変えると HEX も更新されるので、「RGB → HEX」と同じ画面を共有しています。デザインソフトで得たコードをコードの中で使う、ブランドの色をほかの表記に変える、色が明るいか暗いかを知る、といったときに使います。計算はすべてブラウザーの中で行われます。
最初から最後まで
- HEX コードを書きます。 たとえば #1a73e8、1a73e8、短い形なら #17e。
- プレビューを見ます。 色の枠とすべての値が書いた瞬間に更新されます。
- 値をコピーします。 RGB、HSL、CSS 変数の行をコピーして使ってください。
よくある質問
#1a73e8 は RGB でいくつですか。
rgb(26, 115, 232) です。最初の二桁が赤、次の二桁が緑、最後の二桁が青を十六進数で表します。
八桁の HEX は何を意味しますか。
最後の二桁が透明度です。ff は完全に不透明、00 は完全に透明です。#1a73e880 は半透明の青で、結果には RGBA として出ます。
短い HEX（#f00）はどう展開されますか。
それぞれの桁が二回書かれます。#f00 は #ff0000 になります。ツールがこれを自動で行います。
入力したデータはサーバーに送られますか？
いいえ。このツールはすべてブラウザー内で動作し、入力や追加した内容が RUPO Studio のサーバーに送られることはありません。ページを開いている間は、インターネット接続が切れても動作し続けます。アカウントは不要です。利用は無料で、1 時間あたり・1 日あたりの上限はありません。結果を見る前に広告を見る必要もありません。
その他のクリエイターツールツール
RUPO Studio