CI Guide Thomas Pohle, for humans and machines.

01 The brand on one page

The brand is Thomas Pohle. The legal entity is Pohle Advisory GmbH, Hedingen, Switzerland. Thomas Pohle sells momentum. B2B companies call when their marketing doesn’t get going. He gets it moving, together with their team.

Three commitments this guide enforces

1. One red, everywhere the same. Cardinal #CC1E38 for the mark, the accent word, the button and the light trail. One red moment per screen.
2. Dark is the stage. Ember Black #0D0A0A is the default ground. Ash is for print and long documents.
3. One typeface, no AI look. Host Grotesk for everything. One accent word per headline in Cardinal. No eyebrows, no badges, no serif accents.

What this guide does not cover

TEISENDA, which has its own guide. Client-branded deliverables, which follow the client’s CI.

02 Logo

A TP monogram, built on one idea: a 45° cut separates the T from the P and runs on as the top of the P stem. The mark works alone where space is small. The name sits next to it where there is room.

Which lockup, which size

Color versions

Files

Every lockup as outlined SVG (no font needed) and as transparent PNG in three widths. Machine-readable index with sizes: /logos/index.json.

Lockup	Version	Preview	Download
Horizontal	red-ash		SVG PNG 600 PNG 1200 PNG 3000
Horizontal	red-black		SVG PNG 600 PNG 1200 PNG 3000
Horizontal	ash		SVG PNG 600 PNG 1200 PNG 3000
Horizontal	black		SVG PNG 600 PNG 1200 PNG 3000
Horizontal	pure-white		SVG PNG 600 PNG 1200 PNG 3000
Horizontal	pure-black		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	red-ash		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	red-black		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	ash		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	black		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	pure-white		SVG PNG 600 PNG 1200 PNG 3000
Horizontal + claim	pure-black		SVG PNG 600 PNG 1200 PNG 3000
Stacked	red-ash		SVG PNG 400 PNG 800 PNG 2000
Stacked	red-black		SVG PNG 400 PNG 800 PNG 2000
Stacked	ash		SVG PNG 400 PNG 800 PNG 2000
Stacked	black		SVG PNG 400 PNG 800 PNG 2000
Stacked	pure-white		SVG PNG 400 PNG 800 PNG 2000
Stacked	pure-black		SVG PNG 400 PNG 800 PNG 2000
Mark TP	red		SVG PNG 256 PNG 512 PNG 2048
Mark TP	ash		SVG PNG 256 PNG 512 PNG 2048
Mark TP	black		SVG PNG 256 PNG 512 PNG 2048
Mark TP	pure-white		SVG PNG 256 PNG 512 PNG 2048
Mark TP	pure-black		SVG PNG 256 PNG 512 PNG 2048
Name only	ash		SVG PNG 600 PNG 1200 PNG 3000
Name only	black		SVG PNG 600 PNG 1200 PNG 3000
Name only	pure-white		SVG PNG 600 PNG 1200 PNG 3000
Name only	pure-black		SVG PNG 600 PNG 1200 PNG 3000

Clear space

Keep free space around the logo equal to the width of the T stem (14% of the mark height) on every side. Nothing enters this zone: no text, no edges, no other logos.

Favicon and avatars

favicon.svg, favicon.ico (16, 32, 48), favicon-16.png, favicon-32.png, favicon-48.png, apple-touch-icon.png (180), icon-192.png, icon-512.png. Ash mark on Ember Black. Profile avatars: dark with red mark, dark, red (SVG, PNG 1000 in the same folder).

What not to do

• Redraw, retype or stretch the mark
• Recolor the mark outside the defined versions, for example violet or yellow
• Put Ember Black on Cardinal for text or the name (3.6 : 1, too weak for small type)
• Add shadows, outlines, gradients or 3D
• Place the logo on busy photos without a calm dark area
• Rotate or tilt it, even for dynamics

03 Color

Dark is the stage. One red, no second. The same Cardinal is used for the mark, accent words, buttons and the light trail, on dark and on light ground. More than 90% of every surface is Ember Black, Ash and Cardinal.

Neutrals

Contrast, recalculated (WCAG 2.1)

Rules

1. One red, everywhere the same. No tints, no second red.
2. One red moment per screen. One accent word, one button or the trail.
3. On dark, small text is never red. Text below 24 px uses Ash or Smoke.
4. On Cardinal, everything is Ash.
5. No violet, no yellow. Violet belongs to TEISENDA, yellow to Emma Woelk.

Backup color: Petrol

04 Typography

One typeface for everything: Host Grotesk. It is not one of the fonts AI tools reach for by default, and it matches the geometric cut of the TP mark. Emphasis comes from color, never from a second typeface. Let’s get it moving.

Web scale

Hard limits on every page: H1 at most 64 px on desktop and 44 px on mobile, no H2 larger than the H1.

Rules

1. Host Grotesk only. No second family, no serif accents, no italic accent words.
2. No eyebrows, no kicker lines, no badges above a headline.
3. No ALL CAPS, except abbreviations like B2B or CEO.
4. The accent word carries the meaning. It is the word that moves: momentum, moving, found.
5. Never these fonts: Inter, Roboto, Arial or Helvetica as main face, Open Sans, Lato, Montserrat, Poppins, Geist, Space Grotesk, DM Sans, Plus Jakarta Sans, Manrope, Outfit, Sora, Satoshi, Clash Display, General Sans, Cabinet Grotesk, Syne, Instrument Sans, Instrument Serif, Playfair Display, Bricolage Grotesque, Bodoni Moda.

Font files

Free under the SIL Open Font License. Self-hosted only: HostGrotesk-VF.woff2 (web), HostGrotesk-VF.ttf (desktop apps), license. Fallback: a metric-matched Arial (“HG Fallback” in tokens.css), so text breaks the same before the web font arrives.

05 Names

Formats: Momentum plus format

Others, markets, numbers

• Write other companies the way they write themselves: Link11, Beekeeper, smino. Name clients only with their written approval.
• Eight markets: Germany, Switzerland, Austria, United Kingdom, France, Sweden, Poland, USA.
• Numbers are never invented. Format: CHF 40,000 · 10+ years · 30%. Results stay placeholders until confirmed.
• US English throughout: optimize, color, program. The German website version uses standard German with ß and the Sie form.

06 Imagery

One person, one light. Thomas in low-key light with a single Cardinal edge. Everything else stays dark.

Two gears

The Ember look

• Near-black ground, soft key light front left, one thin Cardinal rim light from behind right.
• Black shirt is the signature. Dark navy blazer on stage.
• Calm, confident, half smile. Never posing like a guru.
• Never violet or blue light, never yellow accents, no white studio backgrounds, no stock handshakes.
• On the website the hero portrait is always a cut-out without frame, head and upper body.

AI images

Allowed, including Thomas. Workflow: exactly two reference photos (Shooting Stettin 2025, DT 0167 and DT 0173), GPT Image 2.5 Flare, quality high. Never mix several photos of the same person into one image.

Photorealistic photo of exactly this man from the two reference photos, same face, hair, beard and age, natural skin texture. Near-black background, soft key light from the front left, thin deep crimson rim light (#CC1E38) from behind right. Black shirt. No violet or blue light, no text, no logos.

1. Never present an AI image as a real event, client or place.
2. Never generate clients or other real people.
3. No fake stages with event names, no fake logos on screens.
4. Check face fidelity and hands before use.

Icons

Phosphor, Regular for content, Bold for small sizes. Always inline SVG, never a CDN stylesheet. Ash on dark, Ember Black on light, never red, no duotone, never Lucide. No icon on top of cards. List: /icons/index.json.

07 The light trail

Momentum as an image: one Cardinal trail that rises from left to right and ends at the next step. On this page it runs as an accompanying line along the right margin, and its head marks where you are reading.

Three levels

Rules

1. One trail per surface. Never two trails at once.
2. Rising and smooth. Left to right on heroes and slides, no spikes, no hooks, no loops. Curves are splines with a radius of at least 40 px.
3. Never through text and never across a divider line. It runs in free space behind content.
4. It ends at the next step: the CTA, the next slide, the next carousel card.
5. On the web it draws with the scroll. With reduced motion it is shown complete.
6. Carousels: the trail continues exactly where it left the previous card.
7. Only Cardinal, only on dark ground. On light ground only as a detail line.

08 Voice

Thomas writes like a smart founder talking to another smart person. Not like a content marketer writing for a CEO.

Fast, bold, smart in writing

• Fast: to the point in the first line. Short paragraphs. Fragments are fine.
• Bold: clear opinions. Opinion stays opinion, fact stays fact.
• Smart: authority from experience, never self-praise.
• First person I, reader you, contractions, real numbers and names.

Never

• Emojis
• Em dashes
• Hashtags
• Links inside a LinkedIn post (first comment instead)
• Invented or unverified numbers
• “5 lessons I learned”, fake vulnerability, “As a founder…” openers

Words

Before and after

09 In use

Templates for the places the brand shows up most. Copy the structure, keep the rules.

Website header and hero

E-mail signature

<table cellpadding="0" cellspacing="0" border="0" style="font-family:Arial,Helvetica,sans-serif;color:#0D0A0A;font-size:14px;line-height:1.45">
<tr><td style="padding:0 0 12px 0"><img src="https://ci.thomas-pohle.com/logos/png/thomas-pohle-horizontal-red-black-600.png" width="180" alt="Thomas Pohle" style="display:block;width:180px;height:auto;border:0"></td></tr>
<tr><td style="padding:0"><span style="font-weight:bold;font-size:15px">Thomas Pohle</span><br>
<span style="color:#6E6560">B2B Marketing Advisor</span><br>
<span style="color:#6E6560">CEO &amp; Co-Founder, TEISENDA · Founder, Pohle Advisory GmbH</span></td></tr>
<tr><td style="padding:10px 0 0 0"><hr style="border:0;border-top:2px solid #CC1E38;width:40px;margin:0 0 10px 0;text-align:left">
<a href="mailto:thomas@thomas-pohle.com" style="color:#0D0A0A;text-decoration:none">thomas@thomas-pohle.com</a><br>
<a href="https://thomas-pohle.com" style="color:#0D0A0A;text-decoration:none">thomas-pohle.com</a> · <a href="https://www.linkedin.com/in/thomas-pohle" style="color:#CC1E38;text-decoration:none;font-weight:bold">LinkedIn</a></td></tr>
<tr><td style="padding:12px 0 0 0;font-size:11px;color:#6E6560">Pohle Advisory GmbH · Hedingen, Switzerland</td></tr></table>

Copy

Slides

LinkedIn

Ad and key visual

Document on paper

• Print and long documents are light: white or Ash ground.
• Headings Host Grotesk 700, body 400.
• Footer: Thomas Pohle · thomas-pohle.com, page number. Imprint data on invoices only.
• Invoices and contracts name Pohle Advisory GmbH as sender.

Before you publish

1. Is there exactly one red moment on this screen or page?
2. Is red only used large on dark ground?
3. At most one accent word per headline? No eyebrow, no badge above the H1?
4. Does the trail rise smoothly, avoid text and dividers and end at the next step?
5. Is the logo an original file, in the right version for the ground, with clear space?
6. No violet, no yellow, no Lucide icons, no banned fonts, only Host Grotesk?
7. Does it pass the anti-AI check (chapter 10) and the QA script?
8. Every number real and sourced? No emojis, em dashes or hashtags?
9. Does it sound like Thomas: fast, bold, smart, never a guru?

10 Components and effects

Few parts, used the same way every time, and nothing that looks like a template.

Buttons

Primary: Cardinal, Ash label, 8 px corners (never a pill), one per screen. Secondary: outline with a Line border or a plain text link. Hover: lift by 1 px and a soft ring. Both demo buttons link to the live website.

Lists instead of cards

Content is grouped with space, lines and type, not with boxes. Cards are only used for things you can click. No icon on top of every item, no colored edges, no cards inside cards.

Never looks AI-made

Every page is checked against the anti-AI rulebook and the QA script before it goes live. The short version:

The final question before publishing: would anyone think at first glance that an AI made this? If yes, it is not finished.

Motion

11 Handover

Everything a developer, designer or AI tool needs, in files.

Tokens

@font-face{font-family:"Host Grotesk";src:url("/fonts/HostGrotesk-VF.woff2") format("woff2");font-weight:300 800;font-display:swap}
:root{
  --tp-ember-black:#0D0A0A; --tp-ash:#F4EFEA; --tp-cardinal:#CC1E38;
  --tp-smoke:#A39A94; --tp-stone:#6E6560; --tp-surface:#161010; --tp-surface-2:#1D1414; --tp-line:#2A1D1C;
  --tp-font:"Host Grotesk","HG Fallback",sans-serif;
  --tp-display:clamp(40px,4.4vw,64px); --tp-h1:clamp(36px,4.2vw,58px); --tp-h2:clamp(32px,4.2vw,52px); --tp-h3:clamp(22px,2.2vw,26px);
  --tp-radius-card:6px; --tp-radius-button:8px; --tp-ease:cubic-bezier(.2,.7,.2,1);
}
/* full file with the metric-matched fallback font: tokens.css */

Embed the font

<link rel="preload" href="/fonts/HostGrotesk-VF.woff2" as="font" type="font/woff2" crossorigin>
<link rel="stylesheet" href="/tokens.css">
<!-- self-hosted only: copy /fonts/ next to your page. Never load Host Grotesk from Google Fonts or another CDN. -->

Button

<a class="tp-button" href="https://thomas-pohle.com/#contact">Book a call →</a>
<a class="tp-button tp-button--ghost" href="https://thomas-pohle.com/#how">See how I work</a>
<!-- needs tokens.css -->

Scrollbar

html{scrollbar-color:#2A1D1C #0D0A0A}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#0D0A0A}
::-webkit-scrollbar-thumb{background:#2A1D1C;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:#CC1E38}