カラー変換
色を貼り付けるか選択(HEX、RGB(A)、HSL(A)、HSV、CMYK)すると、すべての形式がプレビュー付きで一度に表示されます。
プレビュー
- HEX
- RGB
- HSL
- HSV
- CMYK
使い方
- 任意の形式で色を入力します。HEX(#FF5733)、rgb(255, 87, 51)、hsl(10.6, 100%, 60%)、hsv(…)、cmyk(…)、または「red」などの色名です。カラースウォッチで選ぶこともできます。
- すべての形式がすぐに表示され、ボタンを押す必要はありません。プレビューには実際の色が表示されます。
- 任意の形式をボタンでコピーします。透明度(アルファ)は保持され、色が完全不透明でない場合は 8 桁の HEX や rgba()/hsla() が表示されます。
例
入力
#FF5733
形式
HEX #FF5733 RGB rgb(255, 87, 51) HSL hsl(10.6, 100%, 60%) HSV hsv(10.6, 80%, 100%) CMYK cmyk(0%, 65.9%, 80%, 0%)
#FF5733 は 1 つのオレンジ色で、同じ色は rgb(255, 87, 51)、hsl(10.6, 100%, 60%)、hsv(10.6, 80%, 100%)、cmyk(0%, 65.9%, 80%, 0%) です。
対象範囲・制限・よくある質問
- 形式は 5 つのみです:HEX、RGB(A)、HSL(A)、HSV、CMYK。CIE-Lab/XYZ、「最も近い色名」の照合、パレットのブレンド、コントラスト(アクセシビリティ)チェックはありません。
- 変換は正確な計算です。成分値は整数、パーセントは小数 1 桁(65.9% など)に丸め、末尾のゼロは削除します。無限精度ではありません。
- カラーピッカー(スウォッチ)はブラウザーのコントロールで、不透明な色のみ表示します。透明度(アルファ)はテキスト欄でのみ入力・表示されます。
- 色名は標準的な CSS キーワード(red、rebeccapurple など)を英語で正確に入力します。「赤」などの日本語名は認識されません。英語のキーワードを入力してください。
- アップロード、保存、URL への書き込みはありません。履歴も、色を含む共有リンクもありません。すべてブラウザー内で動作します。
関連ツール
色を希望の形式にした後によく使われるツールです。