Конвертор CSS цветов

Реализуйте сервис, позволяющий конвертировать цвет из одного формата в другой. Проект включает в себя связанные инпуты RGB и HEX, палитру выбора цвета, синхронное изменение значений, отображение цвета в реальном времени и копирование результата. Продумайте структуру хранения данных и реализацию логики в коде JavaScript. Вся логика должна выполняться на клиенте без перезагрузки страницы. Скачать верстку для проекта.

Основные возможности проекта

Два связанных инпута: RGB и HEX.
Палитра выбора цвета, синхронизированная с инпутами.
Синхронное изменение значений при редактировании любого инпута или палитры.
Отображение выбранного цвета в реальном времени.
Валидация вводимых значений.
Кнопки копирования значений в буфер обмена.

Главная страница

Интерфейс сервиса должен представлять собой два инпута, палитру и блок с отображением цвета:

Инпут для HEX значения.
Инпут для RGB значения в формате rgb(r, g, b).
Палитра выбора цвета (color picker), связанная с теми же значениями.
Блок с цветом, который меняется в зависимости от введённых значений. На блоке показаны текущие HEX и RGB.

Синхронизация

Пользователь может редактировать любой из инпутов или выбрать цвет палитрой:

При изменении RGB инпута — HEX инпут, палитра и превью автоматически обновляются.
При изменении HEX инпута — RGB инпут, палитра и превью автоматически обновляются.
При выборе цвета в палитре — оба инпута и превью обновляются.

Валидация

Сервис должен проверять вводимые данные:

Для RGB - значения должны быть числами от 0 до 255.
Для HEX — строка должна начинаться с #. Допустимы 6 символов (#RRGGBB) или сокращённая форма из 3 символов (#RGB).
При некорректном вводе инпут должен подсвечиваться ошибкой.

Дополнительные возможности

Поддержка RGB с альфа-каналом (RGBA) и отдельное поле для него.
Поддержка сокращённого HEX формата (#RGB → #RRGGBB).
Кнопки копирования HEX, RGB и RGBA в буфер обмена.