В предыдущей заметке 30 онлайн-сервисов для работы с цветом: палитры, оттенки, градиенты я собрала список разных сайтов. В отличие от них, плагин Color Compass помогает подбирать цвета для проектов, не выходя из Фигмы и производя минимальное количество действий.
Сервисы в любом случае имеют массу своих плюсов, но данный плагин хорош именно своей доступностью в процессе работы в самой Фигме, что существенно экономит время на подбор цвета для создания дизайна.
Основные возможности плагина
- Помогает создать цветовую палитру с одним базовым цветом.
- Позволяет точно ориентироваться в цветовом спектре.
- Создает интерактивные образцы, используя один базовый цвет.
Параметры цвета, которые можно настроить
Плагин Color Compass в Figma позволяет настраивать следующие параметры цвета:
- Оттенок. Положение цвета на цветовом круге, которое определяет его основной цвет (например, красный, синий, зеленый).
- Насыщенность. Интенсивность или чистота цвета, которая определяет, сколько серого смешано с цветом.
- Яркость. Степень яркости или затемнения цвета, которая определяет, насколько светлым или темным выглядит цвет.
Используя ползунки в плагине Color Compass, вы можете регулировать оттенок, насыщенность и яркость выбранного цвета для создания различных оттенков цвета. Это поможет вам создать гармоничную цветовую палитру для ваших дизайнов.
Где скачать плагин Color Compass
Категория: цвет, цветовые палитры.
Скачать: https://www.figma.com/community/plugin/754415266574382747
Теги плагина Color Compass
У каждого плагина есть своя страница в Figma Community. И на ней для классификации и удобства поиска каждому из сотен плагинов присваиваются теги. По ним в общих чертах можно понять для чего предназначен тот или иной плагин.
Теги на английском языке и чтобы избежать ошибки в правильности перевода, я представлю их в виде таблицы, где справа будут варианты перевода на русский язык.
| На английском языке | На русском языке (перевод, синонимы) |
|---|---|
| color | цвет, оттенок |
| color theory | теория цвета |
| colour | цвет, тон, оттенок, цветовая гамма, расцветка, цветное, цветность |
| complementary | дополнительный, вспомогательный, добавочный, взаимодополняющий |
| generator | генератор, двигатель, источник, производитель |
| harmony | гармония |
| palette | палитра, цветовая палитра, цветовая гамма |
| shades | оттенки, градации, полутона |
| swatch | образец |
| themes | темы, тематика, разделы |
| tints | оттенки |
| tones | тона |
Перевод официального описания плагина
В этом разделе вы можете прочитать перевод текста со страницы скачивания, чтобы понять как работать с плагином.
Быстро ориентируйтесь в цветовом спектре с точностью, ориентированной на дизайнера.
Группы теперь поддерживаются.
Вместо того, чтобы смотреть и выбирать цвет случайным образом из всего спектра, просто введите базовый цвет в этот плагин, чтобы генерировать оттенки, градации/полутона (shades), тона и комплиментарные цвета.
Увеличьте или уменьшите значение шага, чтобы получить именно тот оттенок, который вы хотите. Экспериментируйте с различными образцами и обновляйте элементы на лету прямо из плагина.
Использовать.
Запустите плагин из Figma. Выберите элемент, содержащий заливку, фон или обводку (группы заметок не поддерживаются). Нажмите на кнопку “Обновить”, чтобы обновить базовый цвет. Нажмите на образец плагина при выборе элемента, чтобы обновить уже существующую заливку, фон или обводку.
Примечания.
Теперь вы можете ввести пользовательский шестнадцатеричный код, если в данный момент ни один элемент не выбран.
Скопируйте шестнадцатеричный код из плагина, нажав на значок буфера обмена. Вы можете продолжать нажимать на обновление, чтобы генерировать случайные цветовые палитры на основе вашего предыдущего выбора цвета.
Нажмите на кнопку "плюс" рядом с надписью палитры, чтобы добавить образцы в свой документ. Этот плагин будет работать с любым элементом, который способен отображать сплошную заливку, обводку или фон.
6 шагов для начала использования плагина
Чтобы использовать плагин Color Compass в Figma, выполните следующие действия:
- Установите плагин со страницы сообщества Figma для плагина.
- Выберите объект или слой, к которому вы хотите применить цвет.
- Откройте плагин Color Compass из меню плагинов в Figma.
- Выберите базовый цвет, нажав на цветовое колесо или введя шестнадцатеричный код.
- Используйте ползунки для настройки оттенка, насыщенности и яркости цвета.
- Нажмите "Применить", чтобы применить цвет к выбранному объекту или слою.
Практика применения плагина Color Compass
Сгенерированные палитры можно добавлять в Фигму нажатием на плюсики. Мгновенно формируются палитры в виде квадратов выстроенных в горизонтальный ряд.
3 аналога плагина Color Compass
Плагин Color Compass для Figma - это инструмент, который помогает дизайнерам точно ориентироваться в цветовом спектре. Если вы ищете другие плагины, связанные с цветом, для Figma, вот несколько вариантов:
- Color Shades генерирует несколько оттенков из одного и того же базового цвета.
- Palette Magic - плагин, который позволяет просматривать и создавать цветовые палитры из одного цвета.
- Color Designer генерирует оттенки и цветовые гармонии на основе выбранных слоев или локальных стилей.
Основные выводы
Color Compass работает быстро, без задержек при нажатии кнопок, что, конечно, очень удобно. И в целом могу сказать, что функциональность, простота и скорость реагирования этого плагина очень радуют, с ним приятно работать.
А на этом сегодня всё. Желаю вам успехов и удачи.
Оставить комментарий