Monu Tools

顏色轉換器

在 HEX、RGB 和 HSL 之間轉換顏色,並提供即時預覽。

如何使用 顏色轉換器

  1. 01

    以 HEX 形式輸入顏色,例如 #ff8800。

  2. 02

    即時查看轉換為 RGB 和 HSL 的結果。

  3. 03

    複製您需要的任意格式。

What it does

This is a color converter for web and design work that translates a color between the three formats you use most: HEX, RGB and HSL, with a live swatch so you can see exactly what you are working with.

This is the everyday glue between design and code: matching a brand color from a mockup to a CSS variable, converting a value a designer gave you in one format to the one your framework wants, or finding a slightly lighter shade for a hover state.

Everything runs in your browser, so it is instant and nothing you enter is sent anywhere.

How the formats differ

Each format describes the same color differently. HEX (like #ff8800) is the compact form used throughout CSS and HTML. RGB states the red, green and blue channels directly, which is how screens and code such as canvas think about color. HSL describes hue, saturation and lightness, which is far more intuitive when you want to nudge a color: change the hue to shift it around the wheel, or the lightness to make it darker without picking a new code by hand.

How the conversion works

Enter a HEX value and the RGB and HSL equivalents update instantly, so you can grab whichever format the tool or codebase in front of you expects.

What is not covered yet

For now the tool focuses on opaque colors in HEX, RGB and HSL; alpha (opacity) support is not included yet.

常見問題

支援哪些格式?

HEX(#rgb 或 #rrggbb)、RGB 和 HSL。輸入 HEX 值,其他格式會即時更新。

支援 alpha / 透明度嗎?

暫不支援。本工具專注於不透明的 HEX、RGB 和 HSL。alpha 支援可在日後加入。

來源

嵌入此工具

將此工具加入你自己的網站。複製下方的程式碼片段,它會自動保持最新。

<iframe src="https://monu.tools/embed/zh-Hant/color-converter" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>

相關工具