カラーフォーマット変換ツール

カラーピッカーで色を選ぶか、HEXコードを直接入力すると、このツールは同じ色をHEX、RGB、HSL、CMYKの値として即座に表示します。デザイン作業やCSS、印刷用モックアップに便利です。各形式はワンクリックでクリップボードにコピーできます。

色

HEXコード

HEX #3B82F6

RGB rgb(59, 130, 246)

HSL hsl(217, 91%, 60%)

CMYK cmyk(76%, 47%, 0%, 4%)

カラーピッカーで色を選ぶか、HEXコードを直接入力してください。ツールはRGB(赤・緑・青)、HSL(色相・彩度・明度)、CMYK(シアン・マゼンタ・イエロー・黒)にその場で変換します。すべてブラウザ内でローカルに計算され、どこにもアップロードされません。

感覚的に色を調整するにはHSLが最も分かりやすいことが多く、明度を上げると淡く、彩度を上げると鮮やかになります。一方RGBとHEXは、そのままCSSに貼り付ける値です。

ここに表示されるCMYK値は、画面プレビューで使われるような単純なRGB→CMYK近似式を使用しています。特定のプリンターや用紙向けにカラーマネジメントで較正されたものではないため、印刷用の正確な値としてではなく、大まかな目安として扱ってください。

このカテゴリの他のツール

絞り、シャッタースピード、ISOの間で等価露出を求めます。

画像や動画を比率を保ったまま拡大縮小し、簡略化した比率を求めます。

線形または放射状のCSSグラデーションをデザインし、生成されたコードをコピーします。

前景色と背景色がWCAGコントラストガイドラインを満たしているか確認します。

任意のベースカラーから、補色・類似色・トライアド配色のパレットを生成します。

基準フォントサイズと拡大比率から、調和の取れたフォントサイズのセットを生成し、CSSカスタムプロパティとしてコピーできます。