# Tomas Kadlec: brand book "Open Label"

Version 1.0 · updated 2026-11-10 · https://tomakadlec.com/brand/

The visual rules for everything published under the name Tomas Kadlec: website, social posts, carousels, ads, banners, thumbnails, video, e-mail and slides. A black-and-white world with one yellow tag, and Tomas's face stands on the tag.

## Files

- https://tomakadlec.com/brand/brand-book.md : this page as Markdown
- https://tomakadlec.com/brand/brand.json : this page as structured data
- https://tomakadlec.com/brand/tokens.css : CSS variables and base classes
- https://tomakadlec.com/brand/tokens.json : design tokens: colours, type scale, tag, spacing
- https://tomakadlec.com/brand/tag.svg : the Tag shape
- https://tomakadlec.com/brand/tag-tk.svg : the Tag with the TK monogram
- https://tomakadlec.com/brand/portrait-tag.png : the portrait that stands on the Tag: real photo, black-and-white cut-out, transparent background, 545×763 px. The yellow comes from the Tag behind it, not from the photo
- https://tomakadlec.com/brand/portrait-tag-lift.png : the same black-and-white portrait, slightly lighter, for the ink (black) Tag of the YouTube thumbnail variant
- https://tomakadlec.com/brand/portrait-cutout-bw.png : the plain black-and-white cut-out, for avatars and other crops
- https://tomakadlec.com/assets/fonts/Archivo-VF.ttf : Archivo variable font (SIL Open Font License)

## How to use this page

This page is written for people and for AI models that design or build anything for the brand. Follow it literally. Where a rule and your taste disagree, the rule wins.

- Read **Colour**, **Typography**, **The Tag** and **Layout** before you make anything. Then read the row for your format in **Channel specs**.
- Build from the tokens and the SVG files listed above. Do not rebuild them from memory.
- Never generate, redraw or alter Tomas's face. The portrait is always the real photo: use the cut-out files listed above, unchanged. If the portrait does not fit the format, use the Tag with the TK monogram or the marker.
- Before you deliver, run the checklist at the end of this page.


## Essence

- **Idea:** a black-and-white world with one yellow tag, and Tomas's face stands on the tag. On content, a one-line label says how the piece was made.
- **Why:** Tomas puts AI agents to work and shows the numbers. The person leads, the system is visible. The label shape can move to physical products later without a rebrand.
- **Personality:** practical, direct, curious, honest about trade-offs. Confident, never hype.
- **Feels like:** a well-made field label or a product tag.
- **Does not feel like:** SaaS navy or purple, neon, robots, glowing brains, hazard tape, stationery, wine, surf school.


## Colour

| Token | HEX | Role | Share |
|---|---|---|---|
| paper | #F5F3EC | default background, text on ink | about 60 % |
| ink | #141414 | text, dark background, buttons | about 25 % |
| yellow | #FFC928 | the Tag or the marker, avatar background, thumbnail variant | about 10 % |
| rule | #D9D5C8 | lines, panels, secondary text on ink | about 3 % |
| graphite | #5E5E58 | secondary text on paper | about 2 % |

Contrast (WCAG): ink on paper 16.6, ink on yellow 12.0, graphite on paper 5.9, rule on ink 12.6.

- **One yellow element per asset:** the Tag, or the marker when there is no portrait. The only exception is the yellow thumbnail variant.
- Yellow is never text on paper (1.4:1). Only ink goes on yellow. Graphite on yellow fails (4.2:1).
- No other colours in templates. Charts use ink, graphite and rule, plus one yellow series.
- Colour appears only in documentary photos and in products.


## Typography

One family: **Archivo**, variable weight and width, with Latin Extended for Czech. IBM Plex Mono only for real code.

| Style | Settings | Cover 1080×1350 | Ad 1080×1350 | Thumbnail 1280×720 | 300×250 | Web desktop / mobile |
|---|---|---|---|---|---|---|
| Headline | weight 800, width 110 (100 on mobile and small ads), tracking -0.025em, sentence case | 104/110, max 5 lines | 96/104 | 112/116, max 3-4 words | 28/30 | H1 72-80, line height 1.05 / 44/48 |
| Body | weight 400 (600 for emphasis), width 100 | 40/52 | 36/46 | none | none | 20/30 / 18/28 |
| Label line | weight 600, width 75, capitals, tracking +0.10em | 26 | none | 30 | none | 13 |
| Name | weight 700, width 100 | 32/40 | 32/40 | 28/36 | 13/16 | none |
| Button | weight 600, width 100 | none | 36/44 | none | 14/18 | 16-18 |

Sizes are font size / line height in px.

- Never shrink type to make copy fit. Rewrite the copy shorter.
- **Label line:** one per asset, at most 45 characters, a 2 px ink rule under it, dropped below 400 px width. It belongs on content only (carousels, articles, newsletter, video). Never on ads and never in the web hero.
- The label line states real facts only. "Checked by Tomas" appears only when he checked the piece. Run numbers are never invented. Example: `NO. 047 · MADE BY AGENTS · CHECKED BY TOMAS`.


## Name, wordmark, monogram

- **Wordmark:** "Tomas Kadlec" in Archivo 800, width 110, sentence case, ink (or paper on ink). No symbol attached.
- **Handle and URL:** `tomakadlec`, lowercase, in label style or body text: `tomakadlec.com`, `@tomakadlec`.
- **Monogram:** "TK", Archivo 900, ink, in the bottom-right of a small yellow Tag (`tag-tk.svg`). For the favicon, ad logos, watermarks and small social uses. Never inside a frame of its own.


## The Tag

**Two versions of the Tag.** Use the first one whenever you can.

| Version | When | Size | File |
|---|---|---|---|
| Tag with the portrait (default) | every asset where the Tag is M or L and the face stays readable: covers, post images, ads, thumbnails, web hero, end cards | M 40 %, L 60 % | `tag.svg` + `portrait-tag.png` (on the ink Tag: `portrait-tag-lift.png`) |
| Tag with the TK monogram | when there is no room for a face or no suitable cut-out: favicon, ad logo, watermark, video corner, e-mail footer, slides | S 16 % | `tag-tk.svg` |

- **Shape:** a 5:6 rectangle with the top-left corner cut at 45°. SVG `viewBox="0 0 100 120"`, path `M22 0H100V120H0V22Z`. No hole, no rounded corners, no rotation, no shadow, no texture.
- **Position:** always flush to the bottom-right corner of the canvas, ignoring margins.
- **Sizes** (width as a share of the format's short side): S 16 % (TK monogram only, no photo), M 40 % (posts, ads, web), L 60 % (thumbnails).
- **Colour:** yellow on paper and on ink. An ink Tag on the yellow thumbnail variant.
- **Portrait on the Tag:** `portrait-tag.png`, width 95 % of the Tag, centred, standing on the Tag's bottom edge. The head rises above the Tag by 13 % of the Tag width. Do not crop, recolour, mirror or retouch it.
- **Keep-out:** no text within 24 px (at 1080 px base) of the Tag or the head.
- **Never:** prices, "sale", numbers or words inside the Tag (it must not read as a discount label). Never two Tags.

**Marker fallback.** For assets without a portrait, such as inner carousel slides and quote cards: a yellow rectangle behind ONE phrase of 1 to 3 words on one line. Height 1.06em, inset 0.12em left and right, ink text, square corners. An asset with a marker has no Tag.


## Photography

- **Portrait:** real photos of Tomas only, as black-and-white cut-outs with a transparent background, from mid-chest up. Never an AI-generated, redrawn or retouched face. The current set is one front pose; the files are listed at the top of this page.
- **In templates:** always the black-and-white cut-out on the Tag.
- **Documentary photos** (about page, articles, video, kite, climbing, travel, desk): natural colour, daylight, uncropped, honest skin. Used full-bleed or in a square-cornered frame. Never inside the Tag.
- **Avatar, all platforms:** black-and-white cut-out on flat yellow #FFC928, head and shoulders, eyes at about 40 % height, no ring, no text, checked at 32 px.
- **Without a suitable cut-out:** use the Tag with the TK monogram, or the marker fallback.


## Illustration and AI images

- Ink only: bold flat shapes on paper. Yellow is added in the layout by the Tag or the marker, never by the image model.
- Real screenshots of real work as evidence. Diagrams and data are drawn as SVG or HTML, not generated.
- Prompt block for image models:

```
Simple editorial illustration of [ONE OBJECT RELEVANT TO THE STORY]. Flat ink #141414 shapes on plain warm paper #F5F3EC, bold contours, at most five major shapes, generous negative space, subject centred with 40% empty space around it. At 1080 px output no line thinner than 12 px; readable at 150 px wide. Ink and paper only. No yellow, no other colours, no people, faces, text, letters, logos, gradients, glow, shadows, 3D, robots, brains or circuitry.
```


## Layout

- **Spacing scale** (px at 1080 base): 8, 16, 24, 32, 48, 64, 96, 128.
- **Social, 1080 base:** 6 columns, 64 px margins, 24 px gutters.
- **Thumbnail 1280×720:** 12 columns, margins 64 px at the sides and 48 px top and bottom.
- **300×250:** 16 px margins, 12 px gap.
- **Web:** 12 columns, max width 1200 px, 24 px gutters. Mobile: 24 px padding.
- **Reading order on every asset:** label line top-left, headline, body, name bottom-left, Tag bottom-right.
- Square corners everywhere. The Tag's cut is the only angle. No gradients, no drop shadows, no glass, no grain.


## Variants

| Variant | Background | Text | Tag | Use |
|---|---|---|---|---|
| Light (default) | paper | ink | yellow Tag | posts, carousels, web, e-mail |
| Dark | ink | paper | yellow Tag | paid ads, video end cards, optional for X images |
| Yellow | yellow | ink | ink Tag | YouTube thumbnails only |

Buttons are neutral. Light: ink button, paper text. Dark: paper button, ink text. Links are underlined, in ink.


## Channel specs

| Asset | Size | Variant | Tag | Notes |
|---|---|---|---|---|
| LinkedIn / Instagram carousel cover | 1080×1350 | light | M with portrait | label line, headline up to 5 lines, name bottom-left |
| Carousel inner slide | 1080×1350 | light | none | marker on the key phrase, slide number in the label line, small name bottom-left |
| Carousel last slide | 1080×1350 | light | M with portrait | one call-to-action line and tomakadlec.com |
| LinkedIn / X post image | 1200×675 (16:9) | light or dark | M with portrait, or marker | headline in the left two thirds |
| Newsletter / article cover | 1280×720 | light | M with portrait, or S | "5-Minute AI Wins" as the label line |
| Meta / LinkedIn ad | 1080×1080, 1080×1350, 1080×1920 | dark | M with portrait | no label line. One headline, one body line, neutral button |
| Google Display / PMax | 1200×628, 1200×1200, 300×250, logo 1200×1200 | dark (light allowed) | M with portrait. Logo: tag-tk.svg on paper | 300×250: name, headline, portrait and button only |
| YouTube thumbnail | 1280×720 | yellow | L ink Tag with portrait | headline of 3-4 words, Archivo 900, sentence case |
| Stories / Reels / Shorts cover | 1080×1920 | light or dark | M with portrait | keep 250 px at the top and 340 px at the bottom clear |
| Profile banners | LinkedIn 1584×396, X 1500×500, YouTube 2560×1440 (safe area 1546×423) | light | none (the avatar overlaps the banner) | one headline line and tomakadlec.com. Marker on 1-3 words |
| Video | 9:16 and 16:9 | none | S with TK, bottom-right, appears at 2 s | captions Archivo 700, paper on a square ink box. Lower third: ink bar with name and role. End card: dark, Tag M with portrait |
| E-mail | 600 px wide | light | S in the footer | wordmark header, ink button, body 16/24 |
| Slides for talks | 1920×1080 | light, dark for section breaks | S on the title and end slide | at most 12 words per slide |
| Business card | 85×55 mm | front yellow with ink TK Tag, back paper | see variant | name, role line, tomakadlec.com |


## Web

- Tokens from `tokens.css`. Body 18-20 px Archivo 400 on paper, line length at most 68 characters.
- **Hero:** wordmark and navigation, headline (no label line), one body line, ink primary button and outlined secondary button, Tag M with portrait flush to the bottom-right of the hero block.
- **Cards:** paper, 1 px rule border, square.
- **Focus ring:** 3 px ink outline, offset 2 px.
- **Dark sections:** ink background, paper text.


## Motion

- Cuts, not effects.
- The Tag slides in from the right edge (200 ms, ease-out) once per video, then stays still.
- The marker wipes in left to right (150 ms).
- Captions appear per phrase. No bouncing words, no emoji.


## Do and don't

**Do:**

- one yellow per asset
- the face on the Tag
- short headlines in Tomas's voice
- real numbers
- square corners
- rewrite instead of shrinking

**Don't:**

- navy, purple, neon, gradients, glow, robots, brains
- yellow text on paper
- two Tags, or a Tag and a marker together
- prices or "sale" in the Tag
- AI-generated faces
- invented run numbers
- a label line in ads or in the web hero
- a ring around the avatar


## Checklist before delivery

- Only paper, ink, yellow, rule and graphite are used, with the exact HEX values.
- There is exactly one yellow element: the Tag or the marker.
- The Tag is flush to the bottom-right corner, not rotated, with nothing written inside it.
- All type is Archivo. The headline is 800 at width 110, in sentence case.
- Nothing was shrunk to fit. No text sits within the Tag's keep-out area.
- All corners are square. There is no gradient, shadow, glow or texture.
- The portrait is the real black-and-white cut-out. No face was generated or changed.
- Every number and every claim in the label line is true.
- Contrast holds: only ink on yellow, no yellow text.
- The asset matches its row in Channel specs: size, variant, Tag size, safe areas.