Windy.app Для страниц на Тильде

Один стиль.
От приложения до страницы.

Дизайн-система Windy.app: спокойный тёмный фон, точная типографика и яркий акцент для главного действия.

Посмотреть компоненты ↓

Фирменная палитра

Мятный — основное действие. Жёлтый — PRO. Тёмные поверхности разделяют контент без лишних теней.

Фон#234658
Карточка#233B4B
Глубокий фон#1C3341
Акцент#00FEB5
PRO#FEB940
Вторичный текст#80A6B2

Graphik LCG

Шрифт уже подключён в проекте. На этой странице он используется для заголовков и основного текста.

Прогноз для ваших плановЗаголовок · 36–52 px · Semibold
Погода в деталяхПодзаголовок · 24 px · Semibold

Сравните прогнозы и выберите время для выхода на воду.

Основной текст · 16 px · Regular
Отступы: 8 / 12 / 16 / 24 / 32 / 48 / 64 px
Скругления: кнопки 6 px · карточки 12 px

Компоненты в работе

Образцы для будущих страниц. Нажмите на кнопки и попробуйте поля: данные никуда не отправляются.

Кнопки

Высота 48 px, скругление 6 px. Одно главное действие на экран.

Выберите кнопку, чтобы проверить состояние нажатия.

Карточка

Тёмная поверхность и короткий текст. Жёлтый акцент обозначает PRO.

PRO

Больше деталей в прогнозе

Сравнивайте модели и планируйте выход на воду с учётом ветра и волн.

Поля и выбор

Постоянные подписи, заметный фокус и понятное состояние выбора. Это демонстрация оформления формы.

Как использовать на следующих страницах

Дублируйте эту страницу или скопируйте весь код из HTML-блока T123 на новую страницу. Меняйте тексты и содержимое, сохраняя цвета, шрифт и отступы. Вся страница собрана в одном HTML-блоке.