Как создать вайб-блок в стиле DESIGN.md
Добавьте стиль DESIGN.md в вайб-блок, чтобы создавать блоки в едином дизайне.
Важно: DESIGN.md — это описание дизайна, которое включает цвета, типографику и компоненты. AI Agent считывает файл и создает блоки в этом стиле.
Добавление DESIGN.md в вайб-блок
Добавьте вайб-блок на страницу, нажмите на иконку плюса и выберите в списке DESIGN.md.
Меню выбора стиля в поле генерации: пункт «DESIGN.md» и выпадающий список «Выберите стиль, который будет применён при генерации».
В контекстном меню нажмите на «Добавить стиль», если хотите добавить и применить свой стиль к генерации. Чтобы перейти к уже добавленным стилям, нажмите на пункт «Библиотека».
Меню выбора стиля генерации: пункт «+ Добавить стиль» и кнопка «Библиотека >».
Если выбрать «Добавить стиль», откроется окно создания собственного стиля. Укажите название и добавьте данные стиля в поле ниже. Затем нажмите «Сохранить».
Окно «Новый стиль»: поля «НАЗВАНИЕ» и «DESIGN MD», кнопка «Загрузить файл» и кнопка «Сохранить».
После этого ваш стиль станет доступен при создании вайб-блока.
Выбор сохраненного стиля в меню выбора стилей при генерации блока.
Если вы перешли в библиотеку стилей, выберите стиль из списка или найдите подходящий вариант по категории. Также стиль можно найти через поиск по названию.
Окно «Библиотека»: фильтры стилей и поле поиска «Введите запрос».
Чтобы использовать стиль, нажмите на него в списке.
Карточка стиля «Nike» в окне «Библиотека» на вкладке «Готовые стили».
А затем, нажмите на кнопку «Применить стиль».

В карточке стиля можно также ознакомиться полностью с его описанием, скопировать стиль или скачать, чтобы внести свои изменения.
Окно «Анализ дизайн-системы»: кнопка «Применить стиль» в правом верхнем углу.
В библиотеке также можно переключиться на вкладку с вашими стилями.
В окне «Библиотека»: вкладка «Свои».
Если вы хотите добавить другой стиль, нажмите кнопку «Добавить стиль» в библиотеке.
Окно «Библиотека»: кнопка «+ Добавить стиль» на вкладке «Свои».
Чтобы применить стиль, нажмите на него в списке или откройте меню по кнопке с тремя точками. В контекстном меню доступны действия «Применить», «Редактировать» и «Удалить».
Вкладка «Мои стили» в окне «Библиотека»: кнопка «Редактировать» напротив добавленного стиля.
Если нужно изменить стиль, откройте окно стиля, внесите изменения и нажмите «Сохранить».
Окно «Редактирование»: кнопка «Сохранить» внизу окна.
Пример использования DESIGN.md
Если в блоке не выбран стиль, просто введите промпт и запустите генерацию.
Вайб-блок в редакторе страницы: поле ввода промпта в блоке «Сгенерируйте код блока» и кнопка отправки запроса.
В этом случае вайб-блок будет создан в стиле, который выберет используемая AI-модель.
Предпросмотр страницы с вайб-блоком преимуществ на темном фоне в стиле DESIGN.md.
Если при генерации блока выбран стиль DESIGN.md, информация о нем появится в поле «Контекст».
Важно: Одновременно для генерации можно использовать только один стиль DESIGN.md.
Вайб-блок: поле для ввода промпта с выбранным контекстом и кнопкой отправки запроса для генерации кода блока с помощью AI.
После этого вайб-блок будет сгенерирован в соответствии с выбранным стилем DESIGN.md.
Пример готового блока в стиле DESIGN.md в режиме предпросмотра: темная плашка с заголовком и тремя карточками преимуществ.
Назад к разделу
Made on
Tilda