Извлечение стайл-гайда сайта
Чтение стилей показывает, что сайт объявляет. Этот инструмент показывает, что сайт реально отрисовывает: страница загружается в настоящем Chromium, читаются вычисленные стили и выдаются те решения, которые дожили до продакшена.
Открыть извлечение стайл-гайдаЗачем нужен настоящий браузер
Современные сайты собирают стили в рантайме — CSS-переменные, утилитарные классы, темы фреймворков, переключение тёмного режима. Разбор CSS-файла всё это пропускает. Только рендер и чтение вычисленных значений покажут цвет, который кнопка получила, а не тот, который был объявлен.
Цвета, взвешенные по использованию
Цвета возвращаются с учётом занимаемой площади экрана и с ролью — фон, текст, граница. Это важно: цвет, покрывающий большую часть страницы, — это фон, а не бренд, и плоский список ввёл бы в заблуждение.
Не только цвет
Извлекаются также типографика, стили кнопок, шкалы отступов и скруглений, библиотека теней, логотипы, иконки и фавиконы, плюс оценка доступности найденных сочетаний. Этого достаточно, чтобы собрать узнаваемую версию дизайн-системы.
По шагам
- Вставьте любой публично доступный URL — страницы под логином не подойдут.
- Дождитесь рендера: тяжёлая страница обрабатывается дольше, браузер ждёт затишья сети.
- Сначала смотрите отчёт по цветам: роли и площадь показывают иерархию.
- В разделах типографики и кнопок берите конкретные значения.
- Скопируйте нужные токены к себе в проект.
Частые вопросы
Почему извлечение стоит кредитов, а другие инструменты бесплатны?
На каждый запрос на нашем сервере запускается настоящий headless-браузер — это дорого по сравнению с арифметикой, которая считается у вас в браузере. Кредиты списываются только после успешного извлечения: неудача ничего не стоит.
Может ли он прочитать страницы под логином?
Нет. Извлекатель заходит как анонимный посетитель и видит только то, что видит незалогиненный человек.
Цвета не совпадают с брендбуком. Почему?
Потому что отчёт показывает, что отрисовывает живой сайт, а не что написано в брендбуке. Расхождение между ними — обычное дело и чаще всего самое полезное в отчёте.