HeyFin v5 | Brand Guidelines

01 · Philosophy

Trust Meets Warmth

v5 distills what worked across four previous iterations into a single, confident system.

v1’s corporate authority meets v4’s human warmth. Royal Blue anchors trust and professionalism while warm neutrals, generous whitespace, and rounded surfaces keep the experience inviting. Every token, component, and copy choice in v5 was tested against one question: does this make a German SMB owner trust us and feel welcome at the same time?

Version Comparison

Trait	v1 — Corporate	v4 — Warm Discovery	v5 — Royal Blue
Accent	#1A1A1A (Black)	#FF7A65 (Coral)	#2563EB (Royal Blue)
Tone	Formal, corporate	Playful, casual	Warm-professional
Radius	4px sharp	12-24px rounded	8-24px balanced
Buttons	Square, dark	Pill, coral	Pill, blue
Animation	None	Spring bouncy	Ease-out subtle

02 · Colors

Royal Blue + Warm Neutrals

A 10-shade blue ramp for flexibility, warm neutrals for the canvas, pastels for feature highlights, and semantic colors for feedback.

Royal Blue Ramp

50 #EFF6FF

100 #DBEAFE

200 #BFDBFE

300 #93C5FD

400 #60A5FA

500 #3B82F6

600 #2563EB PRIMARY

700 #1D4ED8

800 #1E40AF

900 #1E3A8A

950 #172554

Warm Neutrals

--background Background #FAFAF8

--surface Surface #FFFFFF

--surface-muted Srf. Muted #F7F5F2

--surface-warm Srf. Warm #F0F5FF

--border Border #E8E4DF

--text-primary Text Primary #1A1A1A

--text-secondary Text Sec. #5C5650

--text-muted Text Muted #9C958D

Pastels

--pastel-blue Blue #EFF6FF

--pastel-yellow Yellow #FFF8E1

--pastel-rose Rose #FFF0ED

--pastel-lavender Lavender #F0ECFF

--pastel-mint Mint #E8FFF0

Semantic

--success Success #22C55E

--warning Warning #F59E0B

--destructive Destructive #EF4444

03 · Typography

Plus Jakarta Sans + JetBrains Mono

Geometric-yet-rounded letterforms. Warm professionalism with excellent legibility at every scale.

Display
52px / 700

Finde deine Fachkräfte

H1
38px / 600

Überschrift Eins

H2
30px / 600

Überschrift Zwei

H3
22px / 600

Überschrift Drei

H4
18px / 500

Überschrift Vier

Body Large
18px / 400

Beschreib einfach, wen du suchst — wir zeigen dir sofort, wer in deiner Region verfügbar ist.

Body
16px / 400

Standard Fließtext für alle Beschreibungen und Inhalte.

Small
14px / 400

Captions und Hilfetexte

XS
12px / 500

LABELS UND BADGES

Mono
14px / 400

ID 102093 | EUR 75.000 | 14:32:05

German Compound Word Test

Wirtschaftsprüfungsgesellschaft

Longest common compound word — verifies Plus Jakarta Sans handles extended German strings without awkward letter-spacing or kerning breaks.

04 · Components

Warm, Round, Confident

Pill buttons, rounded cards, pastel feature surfaces, and clear input states. Every component reinforces trust and approachability.

Buttons

Primary

Secondary

Ghost & Destructive

Inputs

Default

Focused (click to preview)

Error

Bitte eine gültige PLZ eingeben.

Disabled

Cards

Default Card

Steuerberater / WP

München · Sofort verfügbar · ab 65.000 €

Hover State (hover me)

Bilanzbuchhalter/in

Berlin · Ab Mai · ab 55.000 €

Pastel USP Cards

KI-Suche

Beschreib in eigenen Worten, wen du brauchst.

Karte

Fachkräfte auf der Karte entdecken.

Verifiziert

Jedes Profil wird geprüft.

Sofort

Ergebnisse in Sekunden.

Badges

Accent Success Warning Destructive Neutral

Trust Badges

Verifiziert 4.8 Sterne 2.200+

Testimonial Card

MK

Markus Köhler

Geschäftsführer, Steuerberatung Köhler GmbH

★★★★★

„Innerhalb von zwei Wochen hatten wir drei qualifizierte Bewerber. Die KI-Suche versteht wirklich, was wir brauchen — kein endloses Filtern mehr.“

FAQ Item

Beschreib einfach in eigenen Worten, wen du suchst. Unsere KI analysiert deine Anfrage und findet passende Fachkräfte in deiner Region — ohne komplizierte Filtermasken.

Der Einstieg ist kostenlos. Du zahlst erst, wenn du einen Kandidaten kontaktieren möchtest. Keine monatlichen Gebühren, keine Verpflichtungen.

05 · Logo

HeyFin Wordmark

The wordmark uses Plus Jakarta Sans 700. The dot on the “i” is always Royal Blue on light backgrounds and white on dark backgrounds.

HeyFin

Usage Rules

Minimum size: 80px wide for digital, 20mm for print. Below these thresholds the dot on the “i” becomes illegible.

Clear space: Maintain a clear zone equal to the cap-height of the “H” on all four sides. No other elements may intrude into this zone.

Background Rules

Background	Text Color	Dot Color
#FFFFFF / light	#1A1A1A	#2563EB
#1A1A1A / dark	#FFFFFF	#2563EB
#2563EB / blue	#FFFFFF	#FFFFFF

Generated Logo Concepts

13 active concepts with Gemini-generated variations. A-C from v1 (updated for Royal Blue). G-P are new v2 concepts focused on clean typography and minimal geometric accents. D-F retired (too complex).

Concept A: “The Wordmark”

Pure typographic wordmark. “HeyFin” in Plus Jakarta Sans Bold with Royal Blue dot on the “i”. Like Uber, Spotify, Airbnb.

Concept B: “The Signal”

Two overlapping rounded squares creating a lens/window shape. Black + Royal Blue. Symbolizes matching — two parties connecting.

Concept C: “The Chat Bubble”

Wordmark with the “i” dot replaced by a speech bubble in Royal Blue. References AI chat — a delightful discovery at larger sizes.

v2 Concepts — Clean & Minimal

10 new concepts focused on typographic elegance and minimal geometric accents. 2 Gemini variations each.

Concept G: “The Color Split” v2

“Hey” black + “Fin” Royal Blue. No symbol, no icon — pure typographic color split. The color transition IS the brand mark.

Concept H: “The Big Dot” v2

“Hey.Fin” with an oversized Royal Blue dot as period/separator between the two words. The dot is the brand accent.

Concept I: “The Underline” v2

Royal Blue underline beneath “Fin” only. Highlights the finance domain while keeping the greeting casual. Editorial, sophisticated.

Concept J: “The Frame” v2

Wordmark enclosed in a simple Royal Blue rounded rectangle outline. Badge-style containment. Instant app-icon readability.

Concept K: “The Smile Tail” v2

The lowercase “y” descender curves up as a subtle Royal Blue smile/checkmark. Minimal typographic customization.

Concept L: “The Stack” v2

“HEY” / “FIN” stacked, uppercase, compact square proportion. Blue dot on the “I”. Strong app-icon mark.

Concept M: “The Diamond Dot” v2

Royal Blue square rotated 45° to form a diamond replacing the “i” dot. Geometric precision, distinctive but clean.

Concept N: “The Lowercase” v2

All-lowercase “heyfin” with Royal Blue “i” dot. Ultra-casual, tech-forward, URL/username aesthetic.

Concept O: “The Crown Lines” v2

Two thin Royal Blue parallel lines above the wordmark spanning “Hey”. A quiet typographic flourish adding distinction.

Concept P: “The Ligature Monogram” v2

Connected “hf” monogram in Royal Blue — shared vertical stroke. Works at 16px favicon size. Paired with full wordmark.

Retired: Concepts D (Map Pin), E (Handshake Bridge), F (Spotlight) — too complex/messy for the brand direction. Images preserved in assets/logo/concept_d/, concept_e/, concept_f/.

06 · Voice & Tone

Warm-Professional German

v5 uses “du” (informal address) consistently. The tone is confident, clear, and human — never corporate or stiff.

v1 Formal vs. v5 Warm

Context	v1 (formal)	v5 (warm)
CTA	Jetzt Fachkräfte finden	Zeig mir passende Kandidaten
Onboarding	Willkommen bei HeyFin. Bitte erstellen Sie ein Konto.	Hey! Lass uns dein Team verstärken.
Empty State	Keine Ergebnisse für Ihre Suche.	Noch keine Treffer — versuch’s mit anderen Begriffen.
Error	Ein Fehler ist aufgetreten.	Das hat leider nicht geklappt. Versuch’s nochmal.
Success	Ihr Profil wurde gespeichert.	Gespeichert! Dein Profil ist jetzt live.

“du” vs. “Sie”

We use “du”

HeyFin targets SMB owners, Kanzlei managers, and HR leads aged 28-50. “Du” signals equality and approachability — the same register used by platforms like Xing Jobs, Personio, and Instaffo. It removes hierarchy and makes the first interaction feel collaborative, not transactional.

We avoid “Sie”

Exception: formal legal documents (AGB, Datenschutz, Impressum) may still use “Sie” per German legal convention. All product UI, marketing, email, and support always use “du”.

Banned Words

These words are too corporate, vague, or overused. Avoid them in all HeyFin copy.

synergetisch ganzheitlich innovative Lösung state-of-the-art Mehrwert zeitnah optimieren skalieren Paradigmenwechsel disruptiv best-in-class next level

07 · Spacing & Layout

Spacing, Radius & Shadows

A 4px base unit grid. Consistent spacing creates visual rhythm and professional composure.

Spacing Scale

4px

--space-1

8px

--space-2

12px

--space-3

16px

--space-4

24px

--space-6

32px

--space-8

48px

--space-12

64px

--space-16

96px

--space-24

Border Radius

8px
--radius-sm

12px
--radius-md

16px
--radius-lg

24px
--radius-xl