完全無料

HSL を HEX に 変換

HSLカラー値をHEXカラーコードにリアルタイムで変換 — 無料カラーコンバーター。

色相
彩度 (%)
明度 (%)

HEX 出力

#368CE2
R:54
G:140
B:226

フォーマットをコピー

#HEX フォーマット#368CE2
hsl() フォーマットhsl(210°, 75%, 55%)
rgb() フォーマットrgb(54, 140, 226)

このツールについて

HSL (色相、彩度、明度) カラー値を 16 進コードに変換します。 HSL は直感的なカラー モデルで、色相は色の角度 (0 ~ 360°)、彩度は色の強度 (0 ~ 100%)、明度は色の明るさまたは暗さ (0 ~ 100%) を制御します。 HSL で作業し、CSS の 16 進コードが必要なデザイナーに役立ちます。

使い方

  1. 色相の値 (カラー ホイールの 0 ~ 360 度) を入力します。
  2. 彩度 (0 ~ 100%) と明度 (0 ~ 100%) を設定します。
  3. 16 進コードはリアルタイムで計算されて表示されます。
  4. CSS またはデザイン ツールで使用するために 16 進コードをコピーします。

よくある質問

なぜ 16 進数や RGB ではなく HSL を使用するのでしょうか?
HSL は人間にとってより直観的です。暗い色合いが必要ですか?明度を下げます。ミュートバージョンが必要ですか?彩度を下げます。これらの関係は、3 つのチャネルすべてを調整する必要がある 16 進数または RGB では明らかではありません。
色相 0 対 360 は何を意味しますか?
0° と 360° はどちらも赤です。色相ホイールは一周します。主な色相: 0° = 赤、60° = 黄、120° = 緑、180° = シアン、240° = ブルー、300° = マゼンタ。
彩度 0% と 100% では何が起こるでしょうか?
彩度 0% では、どの色相もグレーの色合いになります (明度のみによって決まります)。彩度 100% では、その色相の最も純粋で最も鮮やかなバージョンが得られます。
軽さはどのように機能しますか?
明度 0% は、色相/彩度に関係なく常に黒です。 100% は常に白です。 50% では、純粋で最も鮮やかなバージョンの色が得られます。 0 ~ 50% の値は暗い色合い、50 ~ 100% は明るい色合いです。