Смеситель цвета: быстрое начало

Всё необходимое для первого успешного запуска: что вставить, какой параметр действительно важен и как читать результат.

Ввод Смеситель цвета Вывод Работает на 100% в браузере — данные не покидают ваше устройство.
Смеситель цвета — Ввод → Вывод. Работает на 100% в браузере — данные не покидают ваше устройство.

Как использовать

  1. Откройте инструмент и вставьте данные в левую панель.
  2. Меняйте только те параметры, которые действительно нужны — значения по умолчанию подходят для большинства случаев.
  3. Читайте результат в правой панели; он обновляется по мере ввода.
  4. Используйте «Копировать», чтобы забрать результат, или «Скачать», чтобы сохранить файл.
Как использовать · Смеситель цвета 1 Вставьте данные в полеввода (или загрузитепример). 2 Настройте параметрыпод нужный формат. 3 Скопируйте, скачайтеили просмотрите вывод— обновляется вживую.
Как использовать — 3

Примеры

Mix against #ffffff at 50% and switch the space to CIE Lab for a perceptually even ramp.

Ввод

#0ea5b7

Вывод — Результаты

#0ea5b7 + #ffffff at 50% (mixed in RGB)

Result
  HEX   #87d2db
  RGB   rgb(135, 210, 219)
  HSL   hsl(186.4, 54.0%, 69.3%)

Contrast against white : 1.71:1
Contrast against black : 12.26:1

Ramp (9 steps)
    0%  #0ea5b7
   13%  #2cb0c0
   25%  #4abcc9
   38%  #68c7d2
   50%  #87d2db
   63%  #a5dde4
   75%  #c3e9ed
   88%  #e1f4f6
  100%  #ffffff

CSS
  --mix: #87d2db;
  background: linear-gradient(90deg, #0ea5b7, #ffffff);

Запустить

Описание

Blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios.

Смеситель цвета → · Как использовать → · Инструменты цвета →

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

Подбор процентов цветаInteractive picker with HEX, RGB and HSL output.Конвертер цвета CodeConvert between HEX, RGB, HSL and named colors.цвета мета-тегов Проверка (WCAG)Verify text contrast ratios against WCAG AA/AAA.Генератор цвета названийShades, tints and complementary schemes from one color.Генератор високосного года цветаBatch random colors with copyable codes.Справочник CSS Именованные ЦветаAll 148 CSS color names with codes and previews.