カラーフォーマットコンバーター

HEX・RGB・HSLカラースペース間をライブプレビュー付きで変換します。

カラースペース変換

カラー値を処理し、インタラクティブなパレットカードを即座に生成します。

カラーフォーマット間で変換する理由

デザイナーはブランドカラーにHEXを使用し、UIシステムは透明なオーバーレイにRGBAチャンネルを使用します。フォーマット間の変換により、デザインツールとコード間の一貫性が保たれます。

主な機能

  • ライブプレビュー: 入力しながら即座にカラーを反映。
  • マルチフォーマット出力: HEX・RGB・HSL・Tailwindクラスを同時表示。
  • クライアントサイド: すべての処理はブラウザ内で実行。
  • コピー対応: 各フォーマットをワンクリックでコピー。

使い方

  1. 入力フィールドにカラー値を入力します。
  2. ライブカラープレビューとすべての変換フォーマットを確認します。
  3. 必要なフォーマットの横にあるコピーボタンをクリックします。
📖

関連記事

Color Format Conversion Guide – HEX, RGB, HSL & More

Understand HEX, RGB, HSL, and OKLCH formats. When to use each, with JavaScript conversion code and CSS examples.