ライブプレビュー
値を編集しながら、表示される色を確認します。
カラーコンバーター
ライブ プレビューを使用して、HEX、RGB、HSL の間で色を変換します。
HEX、RGB、または HSL カラー
デフォルトでは非公開入力とファイルはこのデバイスで処理されます。
無料ですぐにアカウント、キュー、ソフトウェアのインストールは必要ありません。
すぐに使用できます結果が生成されたらすぐにコピーまたはダウンロードします。
使用方法 カラーコンバーター
3 つの簡単なステップで信頼性の高い結果が得られます。
色を入力または選択します
HEX、RGB、HSL、またはビジュアル カラー ピッカーを使用します。
すべての形式を確認する
同等の HEX、RGB、および HSL 値が一緒に更新されます。
必要なものをコピーする
出力行をクリックして、スタイルシートまたはデザイン ファイルにコピーします。
日常業務向けに構築
忙しい仕事をせずに便利
集中的なコントロール、即時のフィードバック、ユーザーと結果の間に何の説明もありません。
一般的な CSS 形式
ブラウザとデザイン ツールで使用される形式の間をきれいに移動します。
ワンクリックでコピー
正規化された各結果はすぐに貼り付けることができます。
実践ガイド
とは何ですか カラーコンバーター?
カラーコンバーターは、同じ目に見える色を異なる表記法で表現します。 HEX はデザインのハンドオフで一般的で、RGB は画面のカラー チャネルをミラーリングし、HSL は色相、彩度、明度を記述します。
表記を変更しても、意図した色は変わりません。パーセンテージベースの値を読みやすい出力のために四捨五入する場合、小さな差異が発生する可能性があります。
実際の応用例
このツールを使用する場合
一般的な方法 カラーコンバーター 実際のプロジェクトや日常業務に適合します。
CSSオーサリング
デザインの HEX 値を RGB または HSL 宣言に変換します。
デザインシステム
混合色形式で受信したトークンを正規化します。
テーマのチューニング
HSL を使用して、明度または彩度を体系的に調整します。
品質保証
異なるように書き込まれた 2 つの値が同じ色を表すことを確認します。
役立つ回答
よくある質問
についての簡単な回答 カラーコンバーター このページの仕組みについても説明します。
HEXをRGBに変換すると色は変わりますか?
いいえ。両方の表記は、同じ赤、緑、青のチャネル値を表します。
HSL は何に役立ちますか?
HSL を使用すると、色相、色の強度、明るさを個別に調整しやすくなります。
アルファ値はサポートされていますか?
電流コンバータは、不透明な HEX、RGB、および HSL カラーに焦点を当てています。
一部の HSL 値が四捨五入されるのはなぜですか?
パーセンテージと色相の値は、CSS 出力を読みやすいように四捨五入されています。