---
title: "Гайдлайны бренда"
description: "Логотип, палитра, типографика и tone of voice VibeCoder Heretic. Общий визуальный и вербальный язык всех поверхностей Heretic."
canonical: https://giglabo.com/ru/brand
locale: ru
---

# Гайдлайны бренда

> Markdown twin of https://giglabo.com/ru/brand
> Fetch this instead of the HTML page: same content, a fraction of the bytes.
> Site structure and the full page list for agents: https://giglabo.com/llms.txt

Логотип, палитра, типографика и tone of voice VibeCoder Heretic. Общий визуальный и вербальный язык всех поверхностей Heretic.

Этот документ описывает общий визуальный и вербальный язык всех поверхностей Heretic — продукт, маркетинговый сайт, документация, сообщество. Используйте его всякий раз, когда делаете что-то под именем Heretic.

## История бренда

VibeCoder Heretic — для разработчиков, которые отказываются отдавать код, данные и ремесло в чужой SaaS. Мы относимся к AI-агентам как к мощному инструменту — быстрому, автономному и **принадлежащему вам**. Self-hosted by default. С характером, не с пафосом.

**Одна строчка:** AI-агенты для кода на вашем компьютере или сервере.

## Tone of Voice

- **Прямо, без корпоративщины.** Короткие предложения. Сильные глаголы. Никакого buzzword-салата.
- **Прагматично, без проповедей.** Сначала trade-off, потом рекомендация.
- **Уверенно, не высокомерно.** У нас есть мнение — и мы объясняем почему.
- **Еретически, не на показ.** Спорим с дефолтами — только когда есть что предложить лучше.

| Так | Не так |
|-----|--------|
| «Запускайте агентов на своей машине.» | «Используйте synergy облачного AI.» |
| «Это ломается под нагрузкой — вот почему.» | «Лидер индустрии по надёжности.» |
| «Берите Postgres. SQLite — только для dev.» | «Лучший в классе data layer.» |

## Логотип

Знак Heretic — это глиф пламени в паре со словесным знаком **VibeCoder Heretic**.

![Знак Heretic — 34px](https://giglabo.com/icon-34.png)
    <figcaption>Знак · 34px (UI)</figcaption>
![Знак Heretic — 256px](https://giglabo.com/favicon-256x256.png)
    <figcaption>Знак · 256px (favicon, соцсети)</figcaption>
![Знак Heretic — 1024px](https://giglabo.com/assets/images/favicon-1024x1024.png)
    <figcaption>Знак · 1024px (мастер)</figcaption>

**Блок (lockup)** — знак слева от словесного знака *VibeCoder* `<gradient>`Heretic`</gradient>` с отступом примерно в половину высоты знака. На «Heretic» всегда лежит brand-градиент.

**Правила**

- Сохраняйте свободное поле вокруг знака — не меньше высоты пламени.
- Не перекрашивайте, не поворачивайте, не растягивайте, не добавляйте эффекты (тени, градиенты).
- На тёмном фоне — светлый вариант. На светлом — тёмный.
- Минимальный размер: 24px по высоте для глифа, 120px по ширине для блока.

**Скачать**

- [PNG · 256px](https://giglabo.com/favicon-256x256.png)
- [PNG · 512px](https://giglabo.com/assets/images/favicon-512x512.png)
- [PNG · 1024px (мастер)](https://giglabo.com/assets/images/favicon-1024x1024.png)
- [ICO · favicon](https://giglabo.com/favicon.ico)

## Цветовая система

Heretic использует **token-based** цветовую систему с семантическими CSS-переменными. Hex-значения зарезервированы для brand-палитры ниже — всё остальное должно ссылаться на токены.

### Brand-палитра

| Токен | Light | Dark | Применение |
|-------|-------|------|------------|
| `--color-brand-violet` | `#8b5cf6` | `#8b5cf6` | Primary brand |
| `--color-brand-purple` | `#7c3aed` | `#7c3aed` | Акцент по умолчанию |
| `--color-brand-purple-dark` | `#6d28d9` | `#6d28d9` | Hover |
| `--color-brand-pink` | `#ec4899` | `#ec4899` | Highlight |
| `--color-brand-orange` | `#f97316` | `#f97316` | Тёплый акцент |

### Семантические токены

Всегда предпочитайте семантические токены (`text-foreground`, `bg-background`, `bg-card`, `text-muted-foreground`, `--color-accent`, `--color-accent-hover`) сырому hex. Они автоматически адаптируются к light/dark и к per-page темам.

### Темы страниц

Сайт поддерживает per-page акцентные темы, которые меняют акцентную палитру без изменения brand identity:

- **Default** — violet/purple (канонический Heretic)
- **Green** — раздел `/education`
- **Blue** — спокойные технические контексты
- **Orange** — раздел `/heretic/newsletter`

Применяется через `` в начале MDX-страницы. Полный маппинг токенов — в `src/styles/theme.css`.

## Типографика

- **UI и body:** системный font stack (дефолт Tailwind) — быстро, нейтрально, читаемо на любой ОС.
- **Заголовки:** тот же стек, weight 600–700.
- **Код и терминал:** monospace stack.
- **Размеры:** для заголовков — `clamp()` с минимумом 24–28px на мобильных. Body — `text-base sm:text-lg`.

Не вводите новые семейства шрифтов без сильной причины — каждый шрифт стоит времени рендера и визуальной целостности.

## Стикеры и маскоты

У Heretic растущее семейство стикеров с котами — для маркетинга, коммьюнити-каналов и поверхностей продукта. Это **не** замена логотипа: используйте их для характера, не для идентификации.

- **Common Heretic Cats** — каноничные иллюстрации котов. Можно использовать везде: на сайте, в слайдах, в печати.
- **Telegram Cats** — Telegram-оптимизированный стикер-пак (прозрачный PNG, 512×512, белая обводка) для чатов и каналов в Telegram.

Полная библиотека, правила и загрузки — на странице [Стикеры](https://giglabo.com/ru/brand/stickers).

## Иконки

Heretic использует [Lucide](https://lucide.dev) во всём UI. Stroke 1.5–2. Цвет — `currentColor`, не хардкод.

## Изображения

- Предпочитайте **скриншоты реального продукта** стоковым иллюстрациям.
- OG-изображения — **пред-сгенерированные PNG** в `public/images/`, не динамические API-роуты.
- Декоративная графика — тёмная, code-adjacent: терминалы, IDE-поверхности, абстрактные градиенты в brand-палитре.

## Стиль текстов

- Sentence case в подзаголовках (`Гайдлайны бренда`, не `Гайдлайны Бренда`) — кроме главного заголовка страницы.
- **Жирным** — одну вещь в абзаце, которая важнее всего. Не для украшения.
- Код, env-переменные, пути, CLI-флаги — в `inline code`.
- Списки должны заслуживать своих буллетов — три коротких абзаца часто лучше десяти пунктов.

## Нейминг

- Продукт: **VibeCoder Heretic** (полностью), **Heretic** (коротко, в контексте).
- Не пишем «The Heretic» — просто *Heretic*.
- Идентификаторы: `heretic-*` (kebab-case) для пакетов и приложений, `Heretic*` (PascalCase) для TypeScript-классов и компонентов.

> **Note: Single source of truth**
>
> Техническая реализация токенов живёт в `src/styles/theme.css` и `src/components/layout/SetPageTheme.tsx`. Если эта страница и код расходятся — код побеждает, а страницу надо обновить.

## Контакт

Вопросы, правки или новый кейс, которому нужен гайдлайн? [Напишите нам](https://giglabo.com/contact-i3kpgwz0jwyw02y004zaqxle).

## Related

- HTML version of this page: https://giglabo.com/ru/brand
- Site map for agents: https://giglabo.com/llms.txt
