na-kakuyu-temu-mozhno-sozdat/design.md

34 lines
1.6 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# AirSound Pro — Дизайн-система
## Цвета
- Фон: `#000000` (глубокий чёрный)
- Текст основной: `#F5F5F7` (светло-серый Apple)
- Текст вторичный: `#86868B` (приглушённый серый)
- Акцент 1: `#6E6E73` (серый металл)
- Акцент 2: `#2997FF` (Apple blue)
- Градиент: `linear-gradient(135deg, #667eea 0%, #764ba2 100%)`
## Типографика
- Заголовки: `-apple-system, BlinkMacSystemFont, "SF Pro Display"`
- Размер H1: `clamp(48px, 8vw, 96px)`
- Размер H2: `clamp(32px, 5vw, 64px)`
- Текст: `17px`, line-height `1.5`
## Эффекты
- Параллакс: `transform: translateZ()` + `perspective`
- Блюр: `backdrop-filter: blur(20px)`
- Анимация: `transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1)`
- Тени: мягкие, рассеянные `box-shadow: 0 20px 40px rgba(0,0,0,0.4)`
## Структура лендинга
1. **Hero** — продукт на фоне градиента, крупный заголовок, CTA
2. **Features** — 3 карточки преимуществ с иконками
3. **Showcase** — полноэкранная секция с параллаксом изображений
4. **Tech Specs** — характеристики в виде сетки
5. **CTA / Footer** — финальный призыв к действию
## Изображения
- Picsum: `https://picsum.photos/1920/1080?random=1`
- Unsplash Source: `https://images.unsplash.com/photo-...`
- Градиентные фоны вместо тяжёлых фото