Дизайн квиза: глобальные стили, цвета и пресеты

На вкладке Design вы задаёте внешний вид всей воронки. От цветов и типографики до стилей компонентов — всё можно настроить под ваш бренд. Вместо того чтобы оформлять каждый элемент по отдельности, LanderLab использует глобальную дизайн-систему, поэтому изменения автоматически применяются ко всей воронке.

​

Как открыть настройки дизайна

Design можно открыть двумя способами:

• Нажмите значок цветовой палитры на левой панели — для глобальных стилей
• Нажмите три точки (•••) на любом блоке и выберите Design — для прямого доступа

По умолчанию все изменения дизайна применяются глобально.

​

Как работает дизайн

Настройки дизайна распространяются на всю воронку по принципу наследования:

• при изменении стилей автоматически обновляются все похожие блоки
• вся воронка выглядит единообразно
• не нужно повторять одни и те же правки

При необходимости стили можно переопределить для отдельных блоков.

​

Цвета

Панель Colors определяет визуальную идентичность вашей воронки.

​

Основные цвета

• Primary Color — используется для кнопок, выбора вариантов и ключевых действий
• Secondary Color — используется для акцентов и выделения

​

Нейтральные цвета

• чёрный, белый и серые оттенки
• используются для текста, фонов и структуры

​

Цвет ошибки

• автоматически применяется к ошибкам валидации и некорректным полям

💡 Совет: сначала задайте основной и дополнительный цвета — так вы создадите единую основу для бренда.

​

Шрифты

Воронка автоматически наследует шрифты лендинга, на котором она размещена.

• настраивать шрифты внутри воронки не нужно
• всё остаётся визуально единым

💡 Совет: задавайте шрифты на уровне лендинга, чтобы все воронки соответствовали стилю вашего бренда.

​

Пресеты

Пресеты — это готовые стили, которые можно мгновенно применить к блокам. Вместо того чтобы создавать стили с нуля, вы можете:

• применить пресет
• при необходимости скорректировать его

​

Пример

Применив пресет к блоку Multiple Choice, вы автоматически зададите:

• цвета
• отступы
• стили кнопок

Благодаря глобальному наследованию:

• обновление стиля одного блока обновляет все похожие блоки

​

Зачем использовать пресеты

• быстрее настройка
• единый дизайн
• не нужен опыт в дизайне

💡 Совет: начните со стандартных пресетов и при необходимости донастройте их позже. Так воронка с самого начала выглядит аккуратно и профессионально.

​

Рекомендации

• задавайте цвета до того, как начнёте собирать воронку
• сохраняйте единообразие стилей на всех шагах
• не перенастраивайте каждый блок без необходимости
• используйте пресеты, чтобы экономить время