# dityam — Бренд-кіт v1.0

Серпень 2026. Логотип, сердечко, кольори, шрифти.

Повні правила: відкрий **`guidelines.html`** у браузері.

## Структура

```
brand-kit/
├─ README.md                  ← ви тут
├─ guidelines.html            повні правила використання
├─ tokens.css                 усі дизайн-токени системи
├─ logo/
│  ├─ mark-orange.svg         векторний знак — масштабується безмежно
│  ├─ mark-ink.svg
│  ├─ mark-cream.svg
│  ├─ heart-orange.svg        сердечко окремо
│  ├─ heart-white.svg
│  ├─ mark-orange-64…1024.png favicon / іконки застосунку
│  ├─ mark-ink-512.png
│  ├─ lockup-horizontal-orange|white|ink.png    прозорий фон
│  ├─ lockup-vertical-orange|white.png
│  ├─ circle-white|orange|ink-800.png           печатка з дескриптором
│  └─ avatar-320.png          аватар соцмереж
├─ colors/
│  ├─ palette-sheet.png       палітра одним зображенням
│  ├─ brand-colors.css        CSS-змінні
│  ├─ brand-colors.json       для дизайн-інструментів і коду
│  └─ brand-colors.txt        hex + RGB + призначення
└─ fonts/                     DM Sans (woff2 / woff / ttf)
```

## Який файл коли брати

| Задача | Файл |
|---|---|
| Сайт, застосунок, будь-який масштаб | `logo/mark-orange.svg` |
| Favicon | `logo/mark-orange-64.png` |
| Іконка застосунку | `logo/mark-orange-1024.png` |
| Шапка документа / презентації | `logo/lockup-horizontal-orange.png` |
| На темному фоні або фото | `logo/lockup-horizontal-white.png` |
| Аватар Instagram / Telegram | `logo/avatar-320.png` |
| Google Business, стікери, печатка | `logo/circle-white-800.png` |
| Кольори в код | `colors/brand-colors.css` |

## Кольори

| | HEX | Призначення |
|---|---|---|
| Dityam orange | `#E85D24` | логотип, кнопки, акценти |
| Cream paper | `#F1EBDE` | основне полотно |
| Ink | `#1A1A1A` | текст, темні плашки (не `#000`) |
| Sage teal | `#CCE8E0` | другий голос, категорії |

Баланс на макеті: **кремовий 60% · чорнильний 22% · помаранчевий 12% · teal 6%.**
Помаранчевий не перевищує ~15% площі — виняток лише spotlight-макети.

## Шрифти

- **Caveat 700 italic** — тільки wordmark і один акцентний рядок на макет.
- **DM Sans 500** — заголовки, трекінг −0.025em.
- **DM Sans 400** — основний текст, line-height 1.55.
- **DM Sans 500 UPPERCASE** +0.04em — рубрики / eyebrow.

Ніяких інших гарнітур. Увага: DM Sans не має кирилиці — для українського тексту система підставляє системний sans; у макетах з кирилицею використовуй Manrope як пару.

## Сердечко 🧡

Єдина емодзі бренду. Одне на макет: у знаку, у підписі або в кінці ключового рядка.
Заборонено: ❤️ 💙 💜 🖤 та будь-який інший колір серця.

## Головні заборони

- Не замінювати шрифт wordmark.
- Не розтягувати, не стискати, не обертати понад −3°.
- Не додавати тіні, обведення, градієнти.
- Не ставити помаранчевий wordmark на помаранчевий фон.
- Не класти логотип на неконтрастне фото без затемнення.

Захисне поле навколо логотипа — не менше висоти знака з усіх боків.
Мінімальні розміри: знак 24 px, аватар 40 px, горизонтальний lockup 120 px.
