Пипетка цвета онлайн

О пипетке цвета онлайн
Используйте эту онлайн-пипетку, чтобы выбрать цвет из загруженного изображения, взять цвет с экрана, если браузер поддерживает такую функцию, или ввести значение вручную. Выбранный цвет сразу преобразуется в популярные форматы HEX, HEXA, RGB, RGBA, HSL, HSLA, HSV и CMYK, чтобы вы могли быстро скопировать нужное значение без перехода на другие страницы.

• Возможности
Пипетка по изображению: выберите локальное изображение и наведите курсор на него, чтобы просматривать соседние пиксели. Нажмите на изображение, чтобы выбрать текущий цвет.

Извлечение палитры изображения: после загрузки изображения инструмент формирует компактную палитру основных цветов, которые можно скопировать или применить как текущий цвет.

Точная настройка по пикселям: после выбора цвета на изображении используйте клавиши со стрелками, чтобы точнее изменить позицию выбранного пикселя.

Выбор цвета с экрана: используйте экранную пипетку браузера, чтобы выбрать цвет с экрана, если эта возможность поддерживается вашим браузером.

Ручной ввод цвета: введите цвет вручную через селектор цвета или значение HEX / HEXA, например #2563EB или #2563EBFF.

Несколько цветовых форматов: конвертируйте выбранный цвет в HEX, HEXA, RGB, RGBA, HSL, HSLA, HSV и CMYK.

Сочетающиеся цвета: создавайте комплементарные, аналогичные, триадные, мягкие светлые и приглушённые варианты на основе текущего цвета.

Оттенки и затемнения: формируйте практичную шкалу от светлого к тёмному для фонов, рамок, состояний наведения, бейджей и UI-компонентов.

Контраст текста и UI-пары: сравнивайте белый и чёрный текст по контрасту WCAG, смотрите перцептивный ориентир в стиле APCA и получайте более комфортную UI-пару, когда насыщенному цвету нужен более тёмный или более светлый фон.

CSS-переменные: копируйте готовые CSS-переменные для текущего цвета, светлого и тёмного вариантов, читаемого цвета текста и рекомендованной пары фон/текст для интерфейса.

Обработка в браузере: чтение изображения, выбор цвета, извлечение палитры и конвертация цветов выполняются прямо в браузере без установки отдельного приложения.

• Примечания
Выбор цвета с экрана зависит от поддержки браузера. Если браузер не поддерживает экранную пипетку, вы всё равно можете использовать выбор цвета по изображению или ручной ввод.

При выборе цвета из изображения оно может масштабироваться под страницу, но выбранный цвет сопоставляется с позицией пикселя в исходном изображении.

Контраст текста рассчитывается для выбранного сплошного цвета. Если текст размещается на градиенте, фотографии, полупрозрачном или текстурном фоне, дополнительно проверяйте итоговый дизайн визуально.

Значение в стиле APCA приведено как перцептивный ориентир рядом с контрастом WCAG. На этой странице именно контраст WCAG остаётся проверкой доступности по принципу «проходит / не проходит».

Для цветов, используемых в интерфейсах, документах, изображениях или печатных материалах, итоговый вид может отличаться в зависимости от настроек дисплея, цветовых профилей, форматов файлов и устройств вывода.

:wiki_link