Как определить цветовые преобразования из заданных цветов?

Question

Наш дизайнер предоставил нам несколько хороших кнопок web 2.0 и т. Д. Я перевел их на прекрасный CSS3.Теперь я хочу пойти за борт и обобщить цветовую схему, используя Sass Color Manulation .

Учитывая базовый фирменный цвет в дизайне (# 7e1a00) и набор производных цветов, используемых для кнопок, ссылок, градиентов и т. Д. (# D05B3D, # 973D24, # 7E1900), как я могу определитькакое преобразование нужно применить к фирменному цвету, чтобы получить производный цвет?

Я могу угадать и проверить, или написать программу грубой силы, чтобы попробовать все комбинации - кажется, что это может быть что-тоумный и простой способ определения.

Есть мысли?

Редактировать Это не должно быть обобщенным решением - я могу разумно определить, какое преобразование применить, посмотревв цветах.Мне нужно определить параметры для преобразования.

Answer 1

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

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

Answer 2

Самый простой способ - это, вероятно, преобразовать цвета в HSL и посмотреть на различия в них. Все функции манипуляции цветом Sass работают в пространстве HSL, поэтому должно быть легко определить, нужно ли вам, например, увеличить яркость или уменьшить насыщенность.