Цвета идентифицируются в HTML и CSS их шестнадцатеричными кодами. Если вы создаете веб-страницу или другой проект HTML и хотите включить элемент, соответствующий определенному цвету, в изображение, веб-сайт или окно на экране вашего компьютера, вам необходимо найти шестнадцатеричный код цвета. Из этой статьи вы узнаете, как использовать различные бесплатные инструменты для быстрого определения шестнадцатеричного кода любого цвета.
Шаги
Метод 1 из 4: использование цифрового измерителя цвета на Mac
Шаг 1. Откройте цифровой измеритель цвета на вашем Mac
Этот инструмент, поставляемый с macOS, может определять значение цвета любого цвета на экране. Откройте Finder, дважды щелкните значок Приложения папку, дважды щелкните Утилиты папку, а затем дважды щелкните Цифровой измеритель цвета чтобы открыть его.
Шаг 2. Переместите курсор мыши к цвету, который вы хотите идентифицировать
Когда вы перемещаете мышь, значения в инструменте обновляются в реальном времени. Не перемещайте указатель мыши из этого места, пока не заблокируете и горизонтальную, и вертикальную диафрагмы.
Вы также можете использовать этот инструмент для определения цветов в Интернете. Просто откройте Safari (или предпочитаемый вами браузер) и перейдите на веб-сайт, содержащий цвет, который вы хотите идентифицировать
Шаг 3. Нажмите ⌘ Command + L
Это блокирует как горизонтальную, так и вертикальную апертуры, что означает, что значение цвета не будет изменяться при перемещении мыши.
Шаг 4. Нажмите ⇧ Shift + ⌘ Command + C, чтобы скопировать шестнадцатеричный код в буфер обмена
Вы также можете скопировать шестнадцатеричный код, нажав кнопку Цвет меню и выбрав Копировать цвет как текст.
Шаг 5. Нажмите ⌘ Command + V, чтобы вставить скопированный код
Вы можете вставить его прямо в свой HTML-код, текстовый файл или любую другую область ввода.
Шаг 6. Нажмите ⌘ Command + L, чтобы разблокировать апертуры
Если вы хотите идентифицировать другой цвет, это снимает блокировку, и курсор снова действует как идентификатор значения цвета.
Метод 2 из 4. Использование Color Cop для Windows
Шаг 1. Установите Color Cop
Color Cop - это небольшая бесплатная утилита, которую вы можете использовать для быстрого определения шестнадцатеричного кода любого цвета на экране. Вот как получить приложение:
- Перейдите на https://colorcop.net/download в веб-браузере.
- Нажмите colorcop-setup.exe в разделе "самостоятельная установка". Если файл не загружается автоматически, щелкните Сохранить или Ok чтобы начать загрузку.
- Дважды щелкните загруженный файл (он находится в Загрузки папку и обычно в нижнем левом углу вкладки браузера).
- Следуйте инструкциям на экране, чтобы установить приложение.
Шаг 2. Откройте Color Cop
Вы найдете его в меню «Пуск».
Шаг 3. Перетащите значок пипетки к цвету, который вы хотите идентифицировать
Вы можете определить любой цвет на экране, в том числе в других приложениях и на веб-сайтах.
Шаг 4. Отпустите кнопку мыши, чтобы открыть шестнадцатеричный код
Код появится в пустом месте в центре приложения.
Шаг 5. Дважды щелкните шестнадцатеричный код и нажмите Ctrl + C
Это скопирует шестнадцатеричный код в буфер обмена.
Шаг 6. Вставьте код в нужное место
Вы можете использовать Ctrl + V чтобы вставить шестнадцатеричный код в любое место, например в код HTML или CSS.
Метод 3 из 4. Использование Imagecolorpicker.com
Шаг 1. Перейдите на сайт https://imagecolorpicker.com на своем компьютере, телефоне или планшете
Вы можете использовать этот бесплатный инструмент для определения шестнадцатеричного кода любого цвета в загруженном изображении. Этот метод будет работать в любом веб-браузере, в том числе на вашем Android, iPhone или iPad.
Шаг 2. Загрузите изображение или введите URL-адрес
Вам нужно будет решить, хотите ли вы загрузить собственное изображение или использовать изображение или веб-сайт, уже находящийся в сети. Любой метод можно использовать для отображения изображения или веб-страницы, чтобы вы могли выбрать желаемый цвет.
- Чтобы загрузить изображение, прокрутите вниз и выберите Загрузите свое изображение, перейдите к изображению на своем компьютере, телефоне или планшете и выберите вариант его загрузки.
- Чтобы использовать веб-сайт, прокрутите вниз до параметра «Использовать это поле для получения цветового кода HTML с веб-сайта», введите URL-адрес и затем щелкните или коснитесь Взять веб-сайт.
- Чтобы выбрать прямое изображение в Интернете вместо всего веб-сайта, введите URL-адрес изображения в поле «Используйте это поле для получения цветового кода HTML из изображения через этот URL-адрес», затем щелкните или коснитесь Возьмите изображение.
Шаг 3. Щелкните или коснитесь нужного цвета в предварительном просмотре изображения / сайта
В левом нижнем углу экрана отобразится шестнадцатеричный цветовой код.
Шаг 4. Щелкните или коснитесь значка копирования, чтобы скопировать шестнадцатеричный код в буфер обмена
Это два перекрывающихся квадрата справа от шестнадцатеричного кода. Затем вы можете вставить его в любой текстовый файл или область ввода.
Метод 4 из 4. Использование Firefox (для цветов в Интернете)
Шаг 1. Откройте Firefox на вашем ПК или Mac
Веб-браузер Firefox поставляется с бесплатным инструментом «Пипетка», который можно использовать для определения шестнадцатеричного кода любого цвета в Интернете. Если у вас установлен Firefox, вы найдете его в меню «Пуск» (Windows) или в папке «Приложения» (macOS).
- Вы можете бесплатно скачать Firefox по адресу
- Firefox сообщит вам только значение цвета на веб-сайте. Вы не можете использовать его вне браузера.
Шаг 2. Перейдите на веб-сайт, содержащий цвет, который вы хотите идентифицировать
Убедитесь, что в поле зрения находится элемент, для которого вам нужен цвет.
Шаг 3. Щелкните меню ☰
Это три горизонтальные линии в правом верхнем углу Firefox.
Шаг 4. Щелкните меню Веб-разработчик
Другое меню раскроется.
Шаг 5. Щелкните Пипетка
Курсор мыши превратится в большой круг.
Шаг 6. Щелкните цвет, который хотите идентифицировать
Вы заметите шестнадцатеричное значение обновления цветов в реальном времени, когда переместите мышь в нужное место. Как только вы щелкнете мышью, Firefox сохранит шестнадцатеричный код в вашем буфере обмена.
Шаг 7. Вставьте код там, где он вам нужен
Вы можете использовать Ctrl + V (ПК) или Command + V (Mac), чтобы вставить шестнадцатеричный код в ваш HTML, CSS или любой другой тип текстового файла.
подсказки
- Существуют и другие веб-сайты, расширения для браузера и программы для редактирования изображений, которые также позволят вам использовать палитру цветов для отображения шестнадцатеричного кода оттенка.
- Если вы знаете, кто создал веб-страницу с цветом, который вы пытаетесь сопоставить, вы всегда можете спросить их, какой шестнадцатеричный код они использовали. Кроме того, вы можете покопаться в исходном коде веб-сайта, чтобы найти шестнадцатеричный код, указанный там.