--- title: "Brand guidelines · Agentrail" description: "The Agentrail brand system: the name, the Byte mark, logo construction and clear space, colour palette and tokens, and typography." canonical: "https://www.agentrail.co/design" --- **Agentrail**Brand Guidelines # A visual system built to make intelligent technology feel clear, human, and connected. Every element is designed to express Agentrail’s role in shaping how people and intelligent systems work together. - [Logo · SVG](https://www.agentrail.co/assets/design/logo.svg) - [Mark · SVG](https://www.agentrail.co/assets/design/mark.svg) ## Contents Three chapters: who we are, the mark, and the system of colour and type. VersionBrand Guidelines 2.0 · September 2026 **Agentrail**Brand Guidelines 02 ## The name Agent + trail. The worker, and the record it leaves. Say itAY-jen-trail 1AGEN2TRAIL Agents that ship real work. A name that says what we do and what we promise: agents that do the work, and a trail of every run — logged, versioned and reversible. **Agentrail**Brand Guidelines 03 ## Personality slider Engineered, precise and built for builders — but never cold. Byte, our raccoon, keeps a little play in the system. How to read itHollow dots show GrowthOS. Filled dots show Agentrail today. - Hand-madeGrowthOS sat at 3 toward Hand-made; Agentrail sits at 3 toward Engineered.Engineered - CasualGrowthOS sat at 2 toward Casual; Agentrail sits at 2 toward Precise.Precise - Mass appealGrowthOS sat at 1 toward Mass appeal; Agentrail sits at 2 toward Builder-first.Builder-first - QuietGrowthOS sat at 1 toward Quiet; Agentrail sits at 2 toward Bold.Bold - SeriousGrowthOS sat at 2 toward Playful; Agentrail sits at 1 toward Serious.Playful - GrowthOS (v0) - Agentrail **Agentrail**Brand Guidelines 04 ## Logo concept The mark is Byte — a raccoon agent launching forward. Six simple shapes, each with a job: speed, care and a trail of shipped work. How to read itNumbers on the mark match the list on the right. Mark · 33 × 21 units ![Byte, the Agentrail mark: a raccoon launching forward](https://www.agentrail.co/assets/design/mark.svg) 1. 01 ### The runner Byte, leaning forward mid-launch. 2. 02 ### The trail Speed lines — the “trail” in Agentrail. 3. 03 ### The cursor An arrow cut into the ringed tail: every run ships. 4. 04 ### The spark A lightning cut for speed and energy. 5. 05 ### The mask The raccoon mask — a watchful night-shift worker. 6. 06 ### The ear Always listening for the next task. **Agentrail**Brand Guidelines 05 ## Mark construction The mark sits on a 33 × 21 unit field. The trail streaks share one launch angle, and a single circle frames the head so it stays legible at 16px. Units1u = 1/21 of the mark height. Guides shown at 1u. b = 33ua = 21u![The Agentrail mark on a 33 × 21 unit construction grid](https://www.agentrail.co/assets/design/mark.svg)Head circle · 13uLaunch angle · 33° **Agentrail**Brand Guidelines 06 ## Wordmark construction A custom geometric wordmark on a 14u cap height with one 2.5u stroke. Letters keep an even b spacing; the mark sits a clear c away. NoteThe A drops its crossbar to echo the launch arrow. Mark topCap heightBaselineMark bottomcbbbbbbbb![The Agentrail logo with construction guides](https://www.agentrail.co/assets/design/logo.svg)Stroke 2.5u **Agentrail**Brand Guidelines 07 ## Clear space Keep a clear zone equal to a — the height of the mark — on every side of the logo. No text, image or edge may enter it. Minimum sizeMark 16px · full logo 96px wide. ![The Agentrail logo inside its clear-space zone](https://www.agentrail.co/assets/design/logo.svg) aa **Agentrail**Brand Guidelines 08 ## Colour palette Ink Navy carries the brand and every action. Neutrals do the rest; green, amber and red appear only to report status. ProportionColumn widths show how often each colour should appear. - ### Ink Navy `HEX #101A38RGB 16, 26, 56` Logo, primary action, accent text - ### Hover Navy `HEX #243556RGB 36, 53, 86` Hover, secondary fills - ### Deep Ink `HEX #0D1117RGB 13, 17, 23` Inverse surfaces, code - ### Page Fog `HEX #F4F6F8RGB 244, 246, 248` Page background - ### Clear White `HEX #FFFFFFRGB 255, 255, 255` Panels, cards - ### Steel `HEX #C5CCD6RGB 197, 204, 214` Strong borders, dividers - - ### Signal Green `#3F9D6ESuccess` - ### Amber `#FEB800Warning` - ### Alert Red `#EB5757Danger` ## Colour tokens Every colour is a token with a light and a dark value. Build with tokens, not hex codes — switching theme then rewrites the whole interface. ThemesLight is the default. Dark uses true black surfaces. | Token | Light | Dark | Use | | -------------------- | ------- | ------- | ---------------------- | | Text | | | | | text/primary | #0F1419 | #EDEDED | Body and headings | | text/secondary | #52606D | #A1A1A1 | Supporting copy | | text/tertiary | #7B8794 | #7A7A7A | Meta, placeholders | | text/on-accent | #FFFFFF | #FFFFFF | Text on filled actions | | text/accent | #101A38 | #C5D0E4 | Links, emphasis | | Surface | | | | | surface/page | #F4F6F8 | #000000 | App background | | surface/panel | #FFFFFF | #0A0A0A | Cards, panels | | surface/muted | #EEF1F4 | #141414 | Wells, table headers | | surface/inverse | #0D1117 | #0D1117 | Code, terminal | | Action | | | | | action/primary | #101A38 | #C5D0E4 | Primary button fill | | action/primary-hover | #243556 | #DCE3F0 | Hover state | | action/focus | #101A38 | #6B83B0 | Focus ring | | Border | | | | | border/default | #E2E6EB | #262626 | Dividers, inputs | | border/strong | #C5CCD6 | #737373 | Hover, emphasis | | Status | | | | | status/success | #3F9D6E | #3F9D6E | Shipped, passed | | status/warning | #FEB800 | #FEB800 | Queued, quota | | status/danger | #EB5757 | #EB5757 | Failed, destructive | **Agentrail**Brand Guidelines 10 ## Typography system Three voices, one system. Chakra Petch speaks for the brand, Aquora softens long reads, and JetBrains Mono is the agent talking — labels, logs and IDs. How to read itEach line points to the typeface and weight used for that element. JetBrains Mono · Medium Early access · 2026 Chakra Petch · Bold Think faster,ship smarter. Aquora · Light Deploy agents that qualify leads, draft follow-ups and watch for churn around the clock. Every run is logged, versioned and reversible. Chakra Petch · SemiBold - Primary ### Chakra Petch Brand, headlines, buttons 200 – 700 - Secondary ### Aquora Body copy, taglines 300 – 800 - Tertiary ### JetBrains Mono Labels, code, logs, IDs 100 – 800 **Agentrail**Brand Guidelines 11 **Agentrail**Brand Guidelines ## Thank you Agents that ship real work, 24/7. [agentrail.ai](https://agentrail.ai/)[brand@agentrail.ai](mailto:brand@agentrail.ai) Keep Agentrail consistent. For logo files, colour tokens or anything this guide doesn’t cover, get in touch.