Harness brand colors
Per-harness color palette used across the Apothem project website and every architectural diagram. One source of truth: one color per harness, one apothem hub.
The canonical brand-name × color-code enumerations below are wrapped in a text fence to preserve verbatim per-harness identifiers required by the palette's catalog purpose.
Apothem core
| Token | Light | Dark | Use |
|---|---|---|---|
apothem-hub | #0F172A | #F1F5F9 | The central distribution node ("apothem") in every architectural diagram. |
shared-profile | #10B981 | #34D399 | The source-of-truth profile feeding the apothem core. |
Harness palette
Fifteen of the seventeen harnesses are colored to match their primary brand
identity, so a reader can tell the tools apart in a diagram. The Apothem mark
itself uses only the slate and emerald colors on the palette
page; it carries no harness color. The remaining two — glm and kimi-code — do not yet have a defined
brand color; their rows are added once the upstream brand color is set, per the
propagation step under Updates.
| 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. |Trademarks
The harness names, product names and brand colors on this page and across the site belong to their owners and are trademarks of their respective owners. Apothem names a tool only to say which one it configures, and uses a tool's color only to tell it apart in a diagram. Apothem is an independent project; it is not affiliated with, sponsored by or endorsed by any of these companies or projects, and it ships none of their logos.
Naming rationale
apothem-hub— the geometric center the name evokes (the apothem of a regular polygon points inward to its core).shared-profile— the upstream source, distinct from any single harness color so it reads as the "input" arrow in every diagram.- Per-harness tokens mirror the harness slug used throughout the codebase (
harnesses/<slug>/, the entry-point key, the CLI--harness <slug>argument). One word per concept; the same string everywhere.
Mermaid usage
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:#FFFFFFAccessibility
Each light-mode token on this page, core and harness alike, keeps its brand color undistorted, so eight of them fall below WCAG 2.2 AA contrast against white text (≥4.5 : 1). The other light-mode tokens meet it. The eight, with their contrast against white:
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 : 1The dark-mode column is for use on dark backgrounds, and none of its tokens reaches 4.5 : 1 against white text. The Mermaid example above sets white text on every fill, so its labels on those eight fills do not reach 4.5 : 1. A diagram that needs WCAG AA text-on-color contrast on one of those eight fills MUST use dark text (#0F172A, which measures 4.63 : 1 to 8.31 : 1 on them) instead of white.
Updates
The palette updates only when a harness ratifies a brand change upstream. The harness colors are defined on this page, not in assets/design-tokens.css or site/app/global.css. Per-harness brand changes propagate atomically across this page and every affected SVG master under assets/src/.
Brand palette
Apothem core brand colors and the fifteen harness brand colors, which are defined on the Harness colors page. The single source of truth for the core colors is the canonical design tokens at assets/design-tokens.css; the site mirrors those values.
Logo Usage
Logo usage rules including variants, raster sizes, clear space requirements, and permitted versus prohibited applications.