Color Converter & Palette Generator

HEX、RGB、HSL、CMYK間で色を変換し、パレットを生成し、コントラストを確認。

{{ line }}
補色
{{ col }}
類似色
{{ col }}
トライアド
{{ col }}
スプリットコンプリメンタリー
{{ col }}
サンプルテキスト 白テキスト
コントラスト比: {{ whiteContrast }}:1
WCAG AA 通常テキスト: {{ whiteContrastVal >= 4.5 ? __t('pass') : __t('fail') }} | WCAG AA 大きいテキスト: {{ whiteContrastVal >= 3 ? __t('pass') : __t('fail') }}
WCAG AAA 通常テキスト: {{ whiteContrastVal >= 7 ? __t('pass') : __t('fail') }} | WCAG AAA 大きいテキスト: {{ whiteContrastVal >= 4.5 ? __t('pass') : __t('fail') }}
サンプルテキスト 黒テキスト
コントラスト比: {{ blackContrast }}:1
WCAG AA 通常テキスト: {{ blackContrastVal >= 4.5 ? __t('pass') : __t('fail') }} | WCAG AA 大きいテキスト: {{ blackContrastVal >= 3 ? __t('pass') : __t('fail') }}
WCAG AAA 通常テキスト: {{ blackContrastVal >= 7 ? __t('pass') : __t('fail') }} | WCAG AAA 大きいテキスト: {{ blackContrastVal >= 4.5 ? __t('pass') : __t('fail') }}

カラーコンバーターとは?

カラーコンバーターは、HEX、RGB、HSL、CMYKなどの異なる色空間間で色値を即座に変換できます。Webデザイナーや開発者は、コンテキストに応じて異なる色形式を使用します。

色空間の説明: HEX、RGB、HSL、CMYK

HEXはCSSで一般的に使用される6桁の16進数値(#RRGGBB)です。RGBは赤、緑、青の値(0–255)で色を定義します。HSLは色相(0–360°)、彩度、明度で色を記述します。CMYK(シアン、マゼンタ、イエロー、ブラック)は印刷用です。

色彩理論とハーモニー

色彩調和は色相環上の色の位置に基づいています。補色は対極(180°)にあり最大のコントラストを生みます。類似色は隣接(±30°)で調和的です。トライアドは等間隔(120°)で活気ある組み合わせです。スプリットコンプリメンタリーは補色の両隣を使用します。