カラー変換
次のステップ
カラープレビュー
#3b82f6
Color Converter - HEX/RGB/HSL
HEX、RGB、HSL の相互変換。プレビュー色付き。
HEX、RGB、または HSL を入力 — 他形式とプレビューがリアルタイム更新。
HEX はスタイルシートにコンパクト、RGB は直感的、HSL は色相/彩度/明度の調整が容易。コンバーターで手計算とコピペミスを排除。
WaiHub のカラー変換は入力時に 3 形式を即時同期しリアルタイムプレビューを表示。すべてブラウザ内でローカル処理。
- HEX ↔ RGB ↔ HSL 変換
- ライブカラープレビュー
- 任意形式を編集すると他が同期
- 形式ごとにワンクリックコピー
- 短縮 HEX 対応
- プライバシー優先のブラウザ処理
機能
- HEX から RGB 変換
- RGB から HSL 変換
- HSL から HEX 変換
- ライブプレビュースウォッチ
- 編集時の双方向同期
- HEX/RGB/HSL をコピー
- 短縮 HEX 対応（#f00）
- 無効形式のフィードバック
- 等幅の色値表示
- ブラウザ内ローカル動作
使い方
色を入力
HEX、RGB、HSL のいずれかに色を入力。
同期値を確認
他の 2 形式が自動的に一致するよう更新。
プレビューを確認
プレビュースウォッチで現在の色を一目で確認。
必要な形式をコピー
HEX、RGB、HSL の横のコピーで CSS 用の値を取得。
例
青
HEX
#3b82f6RGB / HSL
rgb(59, 130, 246) / hsl(217, 91%, 60%)赤の短縮形
HEX
#f00RGB / HSL
rgb(255, 0, 0) / hsl(0, 100%, 50%)よくある質問
- このカラー変換は無料ですか？
- はい。登録不要、完全無料です。
- 短縮 HEX（#f00）は？
- はい。短縮 HEX は自動的に展開されます。
- アルファチャンネルは？
- 不透明色のみ（アルファなし）。
- データはアップロードされますか？
- いいえ。すべてブラウザ内で処理されます。
- 商用利用できますか？
- はい。個人・商用ともに無料です。