Monu Tools

Конвертер цветов

Конвертируйте цвета между форматами HEX, RGB, HSL и HSB. Мгновенный предпросмотр.

Как использовать Конвертер цветов

  1. 01

    Введите цвет в любом формате: HEX, RGB, HSL или HSB.

  2. 02

    Нажмите Выполнить или выберите цвет из палитры.

  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.

Часто задаваемые вопросы

Какой формат цвета использовать в CSS?

В CSS поддерживаются все три формата. HEX удобен для однострочной записи, RGB используется когда нужна прозрачность через rgba(), HSL хорош для управления оттенками и насыщенностью.

Что такое HSB (HSV)?

HSB (Hue, Saturation, Brightness) и HSV (Hue, Saturation, Value), одно и то же. Этот формат используется в графических редакторах. Он отличается от HSL, у которого другая шкала яркости.

Источники

Встроить этот инструмент

Добавьте этот инструмент на свой сайт. Скопируйте фрагмент ниже, он обновляется автоматически.

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

Похожие инструменты