Components › Identity › Identity marks › Brand mark

Brand mark

beta

Brand tile of the workspace on auth and onboarding screens (white-label).

Candidate from gen-usage (AD 3 Oct 2026): used across the app, missing in the registry. Before beta: stories, usage + a11y docs, props. Stories in acrm !4923 (11 Oct 2026); usage + a11y docs still missing → stays candidate.

Used in 6 files · 3 areas · 6× — pages/OdemknoutAsistentaPage, pages/SouhlasPripojeniPage, pages/onboarding

apps/web <BrandMark>SourceStory
ExamplesCodeUsageAccessibilityChangelog

When to use

  • The brand row of the auth and onboarding screens: sign-in, OTP, whitelist, error, consent and assistant unlock. It tells the user which workspace they are entering.

When not to use

  • Inside the app shell. The app switcher has its own 24 px tile.
  • On documents and e-mails. They use the company logo from Firemní styl, not the brand mark (UX-2, 27 Sep 2026).
  • As decoration or a section heading.

Anatomy

  • A 32 px tile with the first letter of the instance name, plus the name next to it.
  • The name comes at runtime from /api/public/branding (useBrand), so the mark is white-label.
  • Component: apps/web/src/components/BrandMark.tsx. CSS: .au-brand (.lg tile, .nm name) in apps/web/src/ds/auth.css.

Best practices

Do
  • Use it once per screen, at the top of the auth card.
  • Let the instance name stay as the only text in the mark.
Don’t
  • Replace the letter with the company logo.
  • Add a tagline, a version or a second line.
  • Resize it. There is one size, on the auth scale.
  • avatar: the same tile idea for people and records.
  • Stories: components--brand-mark--default, --variants, --states, --composition.

Source: docs/avatar/brand-mark.usage.md · GitLab