Фирменные цвета окружений
Палитра цветов по окружениям, используемая на всём сайте проекта Apothem и в каждой архитектурной диаграмме. Единый источник истины: один цвет на окружение, один концентратор apothem.
Канонические перечисления «название бренда × код цвета» ниже заключены в блок кода text, чтобы сохранить дословные идентификаторы окружений, которых требует назначение палитры как каталога.
Ядро Apothem
| Токен | Светлый | Тёмный | Назначение |
|---|---|---|---|
apothem-hub | #0F172A | #F1F5F9 | Центральный узел распределения («apothem») в каждой архитектурной диаграмме. |
shared-profile | #10B981 | #34D399 | Профиль — источник истины, питающий ядро apothem. |
Палитра окружений
Пятнадцать из семнадцати окружений окрашены в соответствии с их основной
фирменной идентичностью, чтобы читатель мог различать инструменты на диаграмме.
Сам знак Apothem использует только цвета slate и emerald со страницы
палитры; цвета окружений в нём нет. Оставшиеся два —
glm и kimi-code — пока не имеют определённого фирменного цвета; их строки
добавляются, как только фирменный цвет задан в вышестоящем источнике, согласно
шагу распространения в разделе Обновления.
| Token | Light | Dark | Source |
|-------------------|-----------|-----------|-----------------------------------------------------------------------------------------------------------------------------------------------------|
| `antigravity` | `#7C3AED` | `#9F67FF` | Google Antigravity deep-purple. |
| `claude-code` | `#CC785C` | `#E89378` | Anthropic terracotta-orange. |
| `codebuddy` | `#0052D9` | `#5E8EF7` | Tencent CodeBuddy blue. |
| `codex` | `#10A37F` | `#19C796` | OpenAI signature teal. |
| `cursor` | `#6E56CF` | `#9B85E3` | Cursor brand purple. |
| `gemini-cli` | `#4285F4` | `#6BA4F7` | Google blue. |
| `github-copilot` | `#0A3069` | `#5B8FE3` | GitHub Mona deep-blue. |
| `hermes` | `#71717A` | `#A1A1AA` | Community silver-grey. |
| `kiro` | `#790ECB` | `#A862DD` | Kiro violet. |
| `open-claw` | `#DC2626` | `#F87171` | Community red-orange. |
| `opencode` | `#F59E0B` | `#FBBF24` | Community amber. |
| `qwen-code` | `#FF6A00` | `#FF8C40` | Alibaba Qwen orange. |
| `trae` | `#FF0066` | `#FF599C` | ByteDance Trae magenta. |
| `windsurf` | `#0EA5E9` | `#38BDF8` | Windsurf sky-blue. |
| `zed` | `#084CCF` | `#5E8BE0` | Zed Industries blue. |Товарные знаки
Названия окружений, названия продуктов и фирменные цвета на этой странице и по всему сайту принадлежат их владельцам и являются товарными знаками соответствующих владельцев. Apothem называет инструмент только для того, чтобы указать, какой из них он настраивает, и использует цвет инструмента только для того, чтобы отличить его на диаграмме. Apothem — независимый проект; он не аффилирован ни с одной из этих компаний или проектов, не спонсируется и не одобряется ими и не поставляет ни одного из их логотипов.
Обоснование именования
apothem-hub— геометрический центр, о котором напоминает название (апофема правильного многоугольника направлена внутрь, к его ядру).shared-profile— вышестоящий источник, отличающийся от цвета любого отдельного окружения, чтобы на каждой диаграмме он читался как стрелка «входа».- Токены по окружениям повторяют slug окружения, используемый по всей кодовой базе (
harnesses/<slug>/, ключ точки входа, аргумент CLI--harness <slug>). Одно слово на понятие; одна и та же строка везде.
Использование в Mermaid
graph LR
P["shared profile"]:::shared-profile --> A["apothem"]:::apothem-hub
A --> AG["Antigravity"]:::antigravity
A --> CC["Claude Code"]:::claude-code
A --> CB["CodeBuddy"]:::codebuddy
A --> CO["Codex"]:::codex
A --> CU["Cursor"]:::cursor
A --> GE["Gemini CLI"]:::gemini-cli
A --> GC["GitHub Copilot"]:::github-copilot
A --> HE["Hermes"]:::hermes
A --> KI["Kiro"]:::kiro
A --> OW["Open-Claw"]:::open-claw
A --> OC["OpenCode"]:::opencode
A --> QW["Qwen Code"]:::qwen-code
A --> TR["Trae"]:::trae
A --> WI["Windsurf"]:::windsurf
A --> ZE["Zed"]:::zed
classDef apothem-hub fill:#0F172A,stroke:#0F172A,color:#FFFFFF
classDef shared-profile fill:#10B981,stroke:#10B981,color:#FFFFFF
classDef antigravity fill:#7C3AED,stroke:#7C3AED,color:#FFFFFF
classDef claude-code fill:#CC785C,stroke:#CC785C,color:#FFFFFF
classDef codebuddy fill:#0052D9,stroke:#0052D9,color:#FFFFFF
classDef codex fill:#10A37F,stroke:#10A37F,color:#FFFFFF
classDef cursor fill:#6E56CF,stroke:#6E56CF,color:#FFFFFF
classDef gemini-cli fill:#4285F4,stroke:#4285F4,color:#FFFFFF
classDef github-copilot fill:#0A3069,stroke:#0A3069,color:#FFFFFF
classDef hermes fill:#71717A,stroke:#71717A,color:#FFFFFF
classDef kiro fill:#790ECB,stroke:#790ECB,color:#FFFFFF
classDef open-claw fill:#DC2626,stroke:#DC2626,color:#FFFFFF
classDef opencode fill:#F59E0B,stroke:#F59E0B,color:#FFFFFF
classDef qwen-code fill:#FF6A00,stroke:#FF6A00,color:#FFFFFF
classDef trae fill:#FF0066,stroke:#FF0066,color:#FFFFFF
classDef windsurf fill:#0EA5E9,stroke:#0EA5E9,color:#FFFFFF
classDef zed fill:#084CCF,stroke:#084CCF,color:#FFFFFFДоступность
Каждый токен светлого режима на этой странице, как ядра, так и окружений, сохраняет свой фирменный цвет без искажений, поэтому восемь из них не достигают контраста WCAG 2.2 AA с белым текстом (≥4.5 : 1). Остальные токены светлого режима его обеспечивают. Эти восемь с их контрастом относительно белого:
shared-profile 2.54 : 1
claude-code 3.28 : 1
codex 3.20 : 1
gemini-cli 3.56 : 1
opencode 2.15 : 1
qwen-code 2.87 : 1
trae 3.86 : 1
windsurf 2.77 : 1Столбец тёмного режима предназначен для использования на тёмных фонах, и ни один из его токенов не достигает 4.5 : 1 с белым текстом. В приведённом выше примере Mermaid на каждой заливке задан белый текст, поэтому его подписи на этих восьми заливках не достигают 4.5 : 1. Диаграмма, которой нужен контраст текста на цвете уровня WCAG AA на одной из этих восьми заливок, ДОЛЖНА использовать вместо белого тёмный текст (#0F172A, контраст которого с ними составляет от 4.63 : 1 до 8.31 : 1).
Обновления
Палитра обновляется только тогда, когда окружение утверждает изменение бренда в вышестоящем источнике. Цвета окружений определены на этой странице, а не в assets/design-tokens.css или site/app/global.css. Изменения бренда отдельного окружения распространяются атомарно на эту страницу и каждый затронутый мастер-файл SVG под assets/src/.
Палитра бренда
Основные цвета бренда Apothem и пятнадцать фирменных цветов окружений, определённых на странице «Цвета окружений». Единственный источник истины для основных цветов — канонические токены дизайна в assets/design-tokens.css; сайт отражает эти значения.
Использование логотипа
Правила использования логотипа, включая варианты, растровые размеры, требования к свободному полю и разрешённые против запрещённых применений.