Как подобрать цвет на сайте с помощью браузера

Любой элемент дизайна можно вычислить с помощью инспектора кода, встроенного в браузере (будем рассматривать на примере Хрома).

Для вызова консоли инспектора нужно кликнуть правой кнопкой мыши на нужный элемент и выбрать "Просмотреть код":

Например, мы хотим подобрать новый цвет для кнопки "В корзину" в карточке товара:

"Просмотрим код" этой кнопки.

Откроется консоль разработчика.

Убедимся, что выделен именно тот кусок кода:

видим в коде текст "в корзину" - значит не промахнулись.

Теперь там же в консоли опускаемся чуть ниже к стилям (Styles):

и практически сразу видим цвет фона нашей кнопки (background-color: #eb5858;).

В CSS для цветов в большинстве случаев используются:

• background или background-color - цвет фона
• color - цвет текста
• border - цвет рамки

Теперь клацаем на квадрат с цветом и появляется окно для подбора своего цвета:

далее подбираем свой цвет:

И в браузере у кнопки сразу изменится цвет на выбранный:

Собственно этот код цвета вам и нужен: #5c8e2e

Чтобы изменения сохранились на сайте - их нужно внести в соответствущем файле стилей и записать

Как узнать этот "соответствующий файл стилей"?

В правом углу выводится название файла стилей и номер строки где это находится, в нашем случае - это файл 0.css (в 95 строке)

А при наведении на него будет показан полный путь до данного файла стилей.

Стили (CSS) лежат в:

/design/активная_тема/css/

или

Админка > Дизайн > Десктоп : Шаблоны и стили

UPD: описание обновлено 07.06.2019