<Концепция />
Знак Web-iT — это слово, обёрнутое в угловые скобки, как тег в коде. Внутри скобок — идея клиента, снаружи — инструменты, которыми мы её реализуем. Отсюда главный принцип бренда: всё важное держим между скобками, остальное убираем.
- СкобкиОткрывающая и закрывающая — начало и конец задачи. Мы отвечаем за всё, что между ними.
- WEB-iTШирокий жирный гротеск оранжевого цвета: энергия и скорость. Строчная «i» — человек внутри технологии.
- IT-COMPANYРазрядка и тонкое начертание — спокойная подпись, как комментарий в коде.
Позиционирование
Web-iT — разработчик веб-программного обеспечения: сайты, личные кабинеты, CRM-системы, мобильные приложения и интеграции. Мы делаем продукты, которые работают, и показываем код, а не презентации.
Аудитория
Основатели стартапов, продакт-менеджеры и ИТ-директора компаний среднего бизнеса. Разбираются в технологиях или хотят разобраться, ценят сроки и прозрачность.
Ценности
clarity— код и договор понятныship()— релиз каждые две неделиopen— доступ к репозиторию с первого дняcare— поддержка после запуска
Характер
const webit = { собранный: true, дружелюбный: true, гиковский: 0.7, прозрачный: "всегда", };
// как тимлид, который объяснит архитектуру на салфетке и не будет занудствовать
Тон голоса
Пишем на «вы», коротко и конкретно. Технические термины — только если клиент их знает. Шутим про код, но не про клиента.
<Знак />
Знак собран из трёх частей и всегда используется целиком. Цвета закреплены: надпись оранжевая, скобки и подпись синие. На тёмном фоне синий светлеет до цвета «Ссылка», чтобы скобки не терялись.
На цветах
Синий и оранжевый фон — только для белого знака. На светлой теме — основная версия.
На фото
На тёмных кадрах — версия для тёмной темы, на светлых — основная. Знак не кладём на экран с кодом: два кода спорят.
Поле и размер
Модуль b — толщина скобки. Охранное поле — 2b со всех сторон.
| --clear-space | 2b (b — толщина скобки) |
| --min-print | 35 мм по ширине |
| --min-screen | 120 px; ниже — только symbol.svg |
| --favicon | скобки на оранжевом, от 16 px |
Построение
Скобки — 2,2 высоты букв. Надпись и подпись выровнены по общей оси. Угол скобок — 45°, как у стрелок клавиатуры.
<Тесты знака />
Восемь тестов, которые должен пройти каждый макет. Если хоть один падает — макет не уходит в релиз.
не растягиватьПропорции знака — константа.не менять цвета местамиНадпись оранжевая, скобки синие.без «киберпанка»Неоновые градиенты — не наш стиль.без теней и свеченияПлоский знак, как интерфейс.не убирать скобкиБез скобок нет идеи знака.не терять контрастСиние скобки на синем исчезают.без 3D и перспективыЗнак всегда смотрит прямо.не на коде и шумеПод знаком — ровный фон.<Цвет />
Палитра — это набор переменных, как в нашем коде. Тёмная тема — основная: так выглядят экраны разработчиков. Оранжевый — цвет действия: кнопка, курсор, надпись знака.
- HEX
- #0E141B
- RGB
- 14 20 27
- CMYK
- 92 67 35 97
- PMS
- ≈ Black 6 C
- роль
- основной
- HEX
- #FA6604
- RGB
- 250 102 4
- CMYK
- 0 70 100 0
- PMS
- ≈ 1505 C
- роль
- основной
- HEX
- #346698
- RGB
- 52 102 152
- CMYK
- 80 45 2 29
- PMS
- ≈ 647 C
- роль
- основной
- HEX
- #7FB2E5
- RGB
- 127 178 229
- CMYK
- 53 21 1 1
- PMS
- ≈ 7451 C
- роль
- дополнительный
- HEX
- #E6EDF3
- RGB
- 230 237 243
- CMYK
- 11 6 6 0
- PMS
- ≈ 9420 C
- роль
- дополнительный
// CMYK — для мелованной бумаги (FOGRA39). Pantone — ближайший по цвету, соответствие приблизительное: для мерча цвет сверяем по образцу ткани.
Контраст
Проверено по WCAG 2.1 — так же, как мы проверяем интерфейсы клиентов.
<Запуск />
--fog / --ink15,7 : 1 · AAA<Запуск />
--ink / --fog15,7 : 1 · AAA<Запуск />
--orange / --ink6,1 : 1 · AA<Запуск />
--sky / --ink8,3 : 1 · AAA<Запуск />
--blue / --fog5,1 : 1 · AA<Запуск />
--ink / --orange6,1 : 1 · AA<Запуск />
--fog / --blue5,1 : 1 · AA<Запуск />
--blue / --ink3,1 : 1 · AA крупный<Шрифт />
Unbounded — широкий геометрический гротеск со скруглёнными углами, родственник надписи WEB-iT: для заголовков и кнопок. JetBrains Mono — шрифт, которым мы сами пишем код: для текста, интерфейсов и подписей.
0O 1l {} [] () => !== </>
Код, который работает
Личный кабинет за 6 недель
Мы спроектировали кабинет для 40 000 клиентов: оплата, документы и чат с менеджером. Время ответа API — 120 мс.
v2.4.1 · обновлено 27.10.2026
await deploy('production') // пятница, 18:00 — нет
Банк в смартфоне за 4 месяца
React Native, Node.js, PostgreSQL. 120 000 установок за первый квартал.
<Графика />
Графический язык собран из скобок знака и интерфейса редактора: теги-рамки, точечная сетка, подсветка синтаксиса и курсор. Иконки — тонкой линией, как в панели инструментов.
Иконки
Линия 2 px, скруглённые концы, сетка 40 × 40. Оранжевый — одна деталь на иконку.
Иллюстрации
Схемы вместо картинок: интерфейсы, блоки, стрелки потоков. Иллюстрация должна объяснять, как работает продукт.
- Схемы — на точечной сетке, блоки со скруглением 8 px
- Потоки данных — оранжевым пунктиром со стрелкой
- Подписи блоков — JetBrains Mono
- Никаких 3D-роботов, лампочек и «цифровых мозгов»
- Никаких стоковых людей в гарнитурах
Фото
Команда за работой, крупные планы экранов и рук, рабочие доски. Холодный свет экранов + тёплый акцент.
<Носители />
Где живёт бренд: сайт, интерфейсы продуктов, иконка приложения, страница 404, презентации и мерч команды. Всё — в тёмной теме по умолчанию.
работает /> Обсудить проектСмотреть кейсы
● 4 в работе
○ 2 в очереди
// но главная на месте cd ~/главная
d.kim@web-it.ru