Beauty-school

Design system preview

Как выглядит стиль Quiet Luxury в реальном рендере — цвета, шрифты, компоненты. Открой в браузере, потыкай, дай фидбек.

01 · Палитра

Цвета

11 токенов. Никакого чистого белого, никакого чёрного. Пропорция 70/20/10 (нейтральный / текст / акцент).

Cream
#EBE0CB · фон primary
Ivory
#E3D6BC · фон карточек
Sand
#D4C4A8 · разделители
Deep
Deep forest
#264A38 · тёмные секции
CTA
Sage
#5A9B7A · основной акцент
Hover
Moss
#3A6B52 · hover / акценты
Micro
Gold
#B8935A · только детали
Text
Dark cocoa
#3E2E20 · основной текст
Text2
Warm brown
#6B5544 · второстепенный
Muted
Soft brown
#8A7864 · приглушённый
02 · Типографика

Основная пара — Cormorant + Inter

Заголовки — вытянутый serif, тонкие начертания. Тело — sans-serif с высокой читаемостью.

H1 · Cormorant Garamond 300

Наращивание волос — как ремесло

H2 · Cormorant Garamond 300

Что удерживает мастера на месте

H3 · Cormorant Garamond 400

Программа курса — 8 практических уроков

Lead · Inter 400

Онлайн-курс от практикующего мастера с 8-летним стажем. 8 уроков, PDF-методички, персональная обратная связь.

Body · Inter 400

После базового курса нет наставника, чтобы проверить твою руку. Технику ставишь «на глаз». Клиентки просят сложные техники, а уверенности в результате нет — приходится отказывать или соглашаться с риском.

Small · Inter 400 Работа Насти, выпускницы первого потока. Октябрь 2026.
Micro · Inter 500 uppercase

01 · Проблема

Альтернативная пара — Prata + Manrope

На случай, если Cormorant не подойдёт на реальных текстах.

H1 · Prata

Наращивание волос — как ремесло

Body · Manrope 400

Онлайн-курс от практикующего мастера с 8-летним стажем. Программа построена вокруг реальных сценариев работы с клиентками.

03 · Кнопки

Три варианта CTA

Прямые углы. Никаких скруглений, никаких теней. Hover — плавный переход цвета.

04 · Карточки

Пример карточек формата

Пример — 3 карточки из блока 05 «Формат обучения».

Видео и методички

8 уроков по 3–15 минут в личном кабинете. К каждому — PDF-компаньон, чтобы не пересматривать видео.

Прямой контакт с Женей

Вопросы задаёшь где привычно — ВК, Telegram, чат курса. Отвечает она сама, не куратор.

Домашние задания с разбором

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

05 · Тарифы

Decoy pricing — 3 варианта

Средний тариф визуально приподнят и с badge «Выбирают 8 из 10» — направляет 80-90% продаж.

Стандарт
X
  • Видео 8 уроков
  • PDF-методички
  • Доступ 3 месяца
  • Проверка домашек
  • Ответы на вопросы
  • Разбор клиенток
Выбирают 8 из 10
Мастер
2–2.5 × X
  • Видео 8 уроков
  • PDF-методички
  • Доступ 6 месяцев
  • Проверка домашек 8 недель
  • Ответы 48 ч
  • Разбор 1 кейса
Персональный
4–5 × X
  • Всё из «Мастера»
  • Доступ бессрочно
  • Приоритет ответа 24 ч
  • Разбор 3 кейсов
  • 2 × 1 час с Женей
  • План развития
06 · Формы

Форма записи в waitlist

Тонкая нижняя граница вместо полной рамки. Метка над полем, а не placeholder внутри.

07 · Аккордеон

FAQ — раскрывающиеся вопросы

По клику на «+» раскрывается ответ. По умолчанию всё закрыто — читатель сам выбирает во что углубиться.

08 · Пример блока в контексте

Блок 02 — Проблема

Как реальный блок выглядит с этой дизайн-системой.

Что удерживает мастера на месте.

  • После базового курса нет наставника, чтобы проверить твою руку. Технику ставишь «на глаз».
  • Клиентки просят сложные техники, а уверенности в результате нет — приходится отказывать или соглашаться с риском.
  • Онлайн-курс обычно = запись лекции. Задать вопрос — некому, разобрать твою работу — некому.
  • Работаешь давно, а средний чек не растёт. Не хватает системного понимания, что делать иначе.
09 · Тёмная секция

Пример на тёмном фоне

Deep forest как альтернатива чёрному. Так может выглядеть футер или один hero-вариант.

Готова начать?

Первый поток — [дата от Жени]. Мест — [N от Жени].

10 · Что не делаем

Антипаттерны

Список того, чего в лендинге НЕ должно быть — страховка от соскальзывания в mass-market.