funkeymonky

"То фронт это только получение АПИ и его вывод + верстка?" Если в общем, то ДА.
Если подробнее, то:
Не во всех компаниях фронты занимаются версткой. Сварганить SPA тоже надо уметь, особенно когда нужно асинхронно в реалтайме обновлять информацию. Плюс всякие локальные задачи: валидация данных; оптимизация размера бандла; потихоньку пришел PWA со своими плюшками (webworkers, пуши, кэш и прочее); работа с API тоже может быть разной (JSON REST, вебсокеты, graphql); Тестирование кода на стороне клиента (приемочные тесты); Трекинг действий пользователя; Различные интерактивные игры (webgl); и прочее...
Область достаточно большая, если копать глубоко.

Если занимаетесь бэкэндом, то попробуйте под этот свой бэкэнд написать клиента, например, на Vue или React.
Возьмите готовый макет. Сверстайте его. Разделите верстку на компоненты. Добавьте хранилище данных. Напишите валидаторы в формах. Сделайте все данные реактивными (изменяются в хранилище - тут же изменяются на странице). Подключите свой бэкэнд к клиенту. Придется написать конвертеры данных, т.к. зачастую с бэкэнда данные приходят не в той структуре, которая нужна клиенту.

А потом внесите изменения в макет. Поменяйте оформление UI-компонентов (инпуты, кнопки, выпадающие списки). Поменяйте расположение блоков. И попробуйте внести эти изменения в свой фронтэнд. Получилось быстро и без проблем? Вот это и есть работа фронтэндера в России.

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

Верстальщик делает из псд макет в sass/less + html + минимальный жс для реализации задумки дизайнера

Если используются готовые компоненты или верстащик уже сделал набор компонент, то фронтендер делает из них шаблоны для своего фреймворка

Между позицией верстальщик и фронтендер - пропасть в виде огромного багажа знаний по js и по конкретному фреймворку

Да, фронты занимаются всем тем, что видит пользователь. И если раньше, это была только верстка под 1-2 браузера, то сейчас это верстка под разные разрешения, анимация, попапы, реактивные компоненты и много чего еще. Не думаю, что обычный бэк пишущий парсеры и API, вот так может взять psd-шный макет по слоям и сделать из него за разумное время адаптивное SPA приложение, например на Vue. Вот отсюда и выросла отрасль - фронт усложнился и нужны узкие специалисты. При этом бэк в свою очередь становится все проще и проще, тк в 90% случаев бэк это лишь набор инструкций для вывода данных из базы.

font-color
background-color

Если есть какой-то брендовый яркий цвет — его можно назвать primary-color.
Если используются различные серые цвета для таблиц — gray, light-gray, dark-gray.

Для всяких плашек — dark, light.

Если дизайнер не упорот, то цветов там сильно больше и не будет.

docs.notepad-plus-plus.org/index.php/Regular_Expre...