Бренд NODQ

Фірмовий стиль, дизайн-система та матеріали для використання.

Перейти до матеріалів Правила використання →

Посібник із брендуОновлено 9 жовтня 2026

NODQ

Точна геометріяКвадратний контур, фаски, рівні інтервали.

Теплий акцентПомаранчевий — мала частка екрана, лише для головного.

Зрозумілий рухОдна дія — одна коротка зміна.

Характер бренду

Технологічна точність, спокійні поверхні й один теплий акцент. Нижче — спостережувані принципи стилю, а не тлумачення знака.

ГеометріяКвадратний контур із заокругленням — простір і межа доступу.

МатеріалиМатовий графіт і одна бурштинова грань.

ТипографікаВелике чітке слово та стримане пояснення.

РухПричина → зміна → результат.

Логотип

Поточна композиція сайту: знак і напис NODQ. Затверджений векторний оригінал ще не опубліковано, тому завантаження логотипа недоступне.

NODQ

Основна композиція · знак + NODQ

Знак · статус окремого активу не затверджено

Малі розміри · 32 / 24 / 16 px — перевірка читабельності

Шахівниця — лише тло попереднього перегляду. Монохромні версії та favicon не показані: оригіналів немає.

Захисне полеПропозиція, не чинний стандарт: x = ¼ висоти знака, вільне поле ≥ 1x з усіх боків.

Мінімальний розмірКандидати для перевірки: композиція від 120 px завширшки, знак від 24 px. Favicon 16/32/48 px — окремий актив, потребує перевірки.Пропозиція · потребує затвердження

Так не можна

✕ Не розтягувати

✕ Не повертати

✕ Не змінювати кольори

✕ Без чужих тіней

Об’ємний об’єкт із головної — декоративний актив; там, де потрібен відтворюваний знак, використовується плаский логотип.

Кольори

Значення збігаються з токенами сайту та файлами nodq-tokens.css / .json.

Помаранчевий NODQ Основний акцент і CTA #F7931A · RGB 247, 147, 26

Глибоке тло Темне тло #0A0C0B · RGB 10, 12, 11

Graphite Панелі #151917 · RGB 21, 25, 23

Піднятий графіт Вкладені поверхні #202622 · RGB 32, 38, 34

Теплий білий Світле тло / текст на темному #F5F4F0 · RGB 245, 244, 240

Ink Темний текст і напис на помаранчевому #121613 · RGB 18, 22, 19

CTA під час наведення#FFAA33

Натиснутий CTA#E3810C

Відблиск (графіка)#FFBD59

Тіньова грань (графіка)#D96800

Вторинний текст · темна#B6BCB7

Вторинний текст · світла#59625B

Посилання · світла#9A4A00

Успіх#8DD6AB / #166B40

Попередження#FFD08A / #875000

Помилка#FF9B92 / #B7342A

Акцент / вибрано✓ Успіх! Попередження✕ Помилка Основний текст · вторинний · посилання Фокус клавіатури

Контраст пар: #121613 на #F7931A ≈ 7,95:1 · #F5F4F0 на #0A0C0B ≈ 17,8:1 · #9A4A00 на #F5F4F0 ≈ 5,7:1. Дрібний білий текст на помаранчевому не використовується. CMYK/Pantone не опубліковано.

Типографіка

Onest 400/500/600/700 і JetBrains Mono для адрес і підписів. Значення — фактичні стилі сайту.

Аа Bb 0123Onest · 400 / 500 / 600 / 700 · кирилиця та латиницяЗвичайнийСереднійНапівжирнийЖирний

Власний текст

H1clamp(34px, 4.4vw, 58px) · 700 · 1.05 · -0.035em Люди. Агенты. Одна сеть.

H2clamp(26px, 2.8vw, 38px) · 600 · 1.12 · -0.025em Правила для расходов агента

Lead17–20px · 500 · 1.4 · -0.01em Сеть для приложений, AI-сервисов и расчётов.

Body16–17px · 400 · 1.6 · 0 Агент работает в пределах бюджета, получателей и срока.

Caption13–14px · 400 · 1.45 · 0 Демонстрация · данные-образцы

Підпис (моно)11px · 400 · 1.3 · 0.08em Заказ #A-1042

Код / Адреса13–14px · 400 · 1.5 · 0 0x3f2c…a91e · 40,8021 NODQ

Сітка та розміри

Показати сітку на зразку

РозділЗаголовок розділуТекст зберігає ширину 60–75 знаків у рядку.

Контейнерmax-width 1360px

Бічні поляclamp(20px, 4.5vw, 72px)

Інтервал розділівclamp(48px, 6vw, 104px)

Проміжки сітки8 · 12 · 16 · 20 · 24 · 32 px

РадіусиПоля — 8 · кнопки — 10 · картки — 12–16 · мітки — 999

Лінії1 px роздільник · 1.5 px схеми

Фокусконтур 2 px + ореол

Тінілише меню та вікна продукту

Компоненти

Статичні зразки станів і один локальний приклад форми — запит нікуди не надсилається.

Кнопки

Основна Наведення Натиснуто Вторинна Недоступна

Вкладки та мітки

ВибраноЗвичайна

ДемонстраціяПроєктуєтьсяДокумент готуєтьсяДоступно

Поле та помилка EmailПідказка під полем

Іконки та графіка

Лінійні іконки Lucide 1.5–2 px на сітці 16 / 20 / 24 px і спільний візуальний словник продуктів.

file-textreceiptmessages-squareusersfoldersearchplugflag

Не змішувати лінійні, заливні й об’ємні набори.

Простір

Агент

Повноваження

Розрахунок

Рух

Один приклад за раз. Крива cubic-bezier(0.2, 0.8, 0.2, 1). За системного налаштування «зменшити рух» показується кінцевий кадр.

Кнопка / вкладка 180 мс · наведення, вибір

Зміна стану 350 мс · новий статус

Фірмовий маршрут 1000 мс · одна дія

Без райдужного брендингу, нестандартного курсора, перехоплення прокручування, друкування заголовків по літерах та анімації випадкових сум.

Приклади застосування

Ті самі правила на реальних сторінках сайту.

Перший екран сайту →Темна сцена, фірмовий об’єкт, помаранчевий CTA Панель Agent Wallet →Перевірка правил, семантичні стани Робочий простір IZIGRAM →Світлий документ, вибрана область доступу

Обкладинка презентації, картка анонсу та спільне розміщення з партнером не показані: затверджених матеріалів немає.

Завантажити матеріали

Публікуються лише наявні файли. Загальний ZIP-пакет поки не зібрано.

Токени · CSSКольори, шрифти, контейнер, крива руху · CSS · текст · 9 жовт. 2026Завантажити

Токени · JSONТой самий набір значень для застосунків · JSON · текст · 9 жовт. 2026Завантажити

Короткі правилаЩо входить і як використовувати · TXT · текст · 9 жовт. 2026Завантажити

Логотип SVGНемає затвердженого оригіналуДокумент готується

Логотип PNG (світлий / темний)Немає затвердженого оригіналуДокумент готується

Бренд-пакет ZIPНемає затвердженого оригіналуДокумент готується

Версія та зворотний зв’язок

v0.19 жовт. 2026 · перша публікація посібника: палітра, типографіка, компоненти, токени. Чернетка.

Питання щодо використання брендуЧерез сторінку «Контакти»