Проверка и извлечение в браузере

Бесплатное извлечение палитры веб-страницы.

Используемые цвета с ролями и исходными элементами.

Собирайте цвета с изучаемой страницы и связывайте каждое значение с видимым элементом и назначением.

Нужны расширение Chrome и аккаунт.
25 бесплатных задач автоматизации в месяц суммарно для всех инструментов. Действуют ограничения провайдера в браузере.

ЧТО НУЖНО ПОДГОТОВИТЬ

Видимые стили выбранной страницы.

ОТПРАВНАЯ ТОЧКА

Задача, которую можно настроить под себя.

Скопируйте здесь. Вставьте в WebAct, когда будете готовы.

Эта страница подготавливает промпт. Задача выполняется в WebAct.

01

Настройте задачу под себя.

Проверьте промпт выше. Добавьте свою цель и важные требования.

02

Перенесите задачу в WebAct.

Откройте исходную страницу, активируйте WebAct и выберите нужное доступное для чтения содержимое. Вставьте задание и предоставьте дополнительные исходные материалы, которые оно запрашивает.

03

Проверьте полезную часть.

Результат охватывает доступное для чтения содержимое, которое вы предоставили или выбрали. Сначала разверните нужные разделы страницы и проверьте, что в результате есть все задуманные записи.

ПРАКТИЧЕСКОЕ РУКОВОДСТВО

Как собрать цвета страницы и не спутать их с брендбуком.

Извлекайте цвета из реально отображаемых стилей и указывайте их роли. Заметный акцент не обязательно является единственным утверждённым фирменным цветом.

Адаптируйте процесс под свою задачу.

Изучите выбранные элементы и запишите цвета с видимыми ролями: текст, граница, фон. Отделяйте вычисленные значения CSS от цветов, взятых с изображения. Сохраняйте ссылки на элементы и указывайте проверенное состояние или тему страницы.

Что вы предоставляете
Видимые стили выбранной страницы.
Что вы получите
Используемые цвета с ролями и исходными элементами.

Посмотрите входные данные и результат.

Иллюстративные входные и выходные данные · учебный пример, а не реальный запуск WebAct

Полей ввода: Пример

Supplied style inspection: .card background #ffffff; button.primary background #d97736. These are inspected values, not official brand guidelines.

Готовый пример

.card — role: card background — color: #ffffff
button.primary — role: primary-button background — color: #d97736
Scope: two supplied element styles. Hover states, theme variants and brand approval are not established by this sample.
Скачать этот пример

Добавьте эти данные в промпт и скопируйте его в WebAct, чтобы попробовать задачу. Ваш результат может отличаться от примера.

Решения и устранение проблем.

Можно ли считать цвета одной страницы официальной палитрой бренда?

Они описывают лишь проверенную страницу. Правила бренда, доступные сочетания и утверждённые варианты требуют отдельной документации.

Почему цвет кнопки меняется при наведении?

Интерактивные состояния могут переопределять обычный стиль. Записывайте состояние вместе со значением для полезной палитры.

Попробуйте на собственном источнике.

Замените пример своим материалом в промпте. Сохраните нужные требования и скопируйте задачу в WebAct.

Настроить и скопировать задачу ↑
ПЕРЕД НАЧАЛОМ

Использование WebAct.

Промпт и пример доступны здесь. Выполните задачу в расширении WebAct для Chrome.

Этот инструмент бесплатный?

Здесь можно бесплатно копировать и редактировать промпт. Для использования с WebAct установите расширение Chrome, создайте и подтвердите аккаунт и подключите доступную сессию ChatGPT в браузере. План Free включает 25 задач автоматизации, запускаемых пользователем, за календарный месяц суммарно для всех инструментов. Обычный браузерный Chat учитывается отдельно; действуют ограничения провайдера.

Узнайте об общем контексте в нашем политике конфиденциальности и о выборе между Chat и Task.

ОТ ПРОМПТА К ВАШЕЙ РАБОТЕ

Перенесите задачу на свою страницу.

Установите WebAct, добавьте исходные материалы и адаптируйте результат.

Установить WebAct