Color Palette Extractor
Извлеките цветовую палитру с любого сайта. Скопируйте HEX/RGB/HSL коды и используйте в своём дизайне.
Анализируем первый экран сайта (1280×800). Занимает ~10–15 секунд.
Как использовать палитру
Дизайн и брендинг
Извлеките цвета конкурентов или понравившихся сайтов для вдохновения в дизайне.
Разработка
Скопируйте готовые CSS переменные и используйте в своём проекте.
Ребрендинг
Проанализируйте цветовую гамму сайта перед редизайном или миграцией стилей.
About Генератор цветовых палитр
Color Palette Generator создаёт согласованные цветовые палитры на основе правил цветового круга. Получите основной цвет, акценты и нейтральные оттенки — экспортируйте в CSS-переменные или Tailwind.
Frequently asked questions
Монохромная — оттенки одного цвета. Аналогичная — соседние цвета на круге (например, синий и зелёный). Комплементарная — противоположные (синий и оранжевый). Триада — три цвета через 120°. Раздельно-комплементарная — основной + два соседних к противоположному.
Используйте оттенки серого с лёгким подтоном основного цвета — палитра будет выглядеть целостнее. Или берите чистый серый (#808080 и производные) для нейтрального фона. Инструменты вроде Coolors и наш генератор предлагают автоматические нейтрали.
Для веб-проекта обычно достаточно 5–7: основной, 1–2 акцента, светлый и тёмный фон, цвет текста. Минималистичные сайты обходятся 3–4. Избыток цветов усложняет поддержку и нарушает визуальную иерархию.
Добавьте цвета в tailwind.config.js в theme.extend.colors. Или используйте CSS-переменные и укажите их в конфиге. Генератор может выдать готовый фрагмент конфига — скопируйте и вставьте в проект.
Многие генераторы показывают контраст между цветами палитры. Для текста и фона проверяйте комбинации через Color Contrast Checker. Выбирайте пары с коэффициентом минимум 4.5:1 для обычного текста по WCAG AA.
Related tools
Other useful reChecker tools