FRAAI
Brand Guide

2026 · fraai.agency

01 — Het beeldmerk

Beeldmerk

Primair · donkere achtergronden
Omgekeerd · lichte achtergronden
Sterk · blauwe achtergronden
Beeldmerk + woordmerk: combineer het F-beeldmerk altijd met het FRAAI-woordmerk in Pangram Sans. Houd een minimale witruimte van 1× de hoogte van het merk aan alle kanten aan. Het merk mag nooit worden vervormd, gedraaid, herkleurd of op een drukke achtergrond worden geplaatst.
02 — Kleurensysteem

Palet

Ink
#1A1A1C · RGB 26 26 28
Basis voor autoriteit. Koppen, footers, primaire tekst.
Brand Blue
#3D52D5 · RGB 61 82 213
Primaire merkkleur. CTA's, links, beeldmerken, highlights.
Cream
#F4F3EF · RGB 244 243 239
Warm pagina-oppervlak. Achtergronden voor secties, kaarten.
Terra
#EA9571 · RGB 234 149 113
Accent voor menselijke warmte. Illustraties, callouts, team.
Blue Light
#7B92E8
Blue Tint
#C5CDF5
03 — Typografie

Pangram Sans

Online oplossingen
die presteren.
Display Pangram Sans · 700 · −3% tracking
Foundry pangrampangram.com
Web alternatief Space Grotesk (Google Fonts)
Display
64px / 700 / −3%
Fraai
H1
40px / 700 / −2%
Werkt echt.
H2
28px / 700 / −1.5%
Services & Cases
H3
20px / 600 / −1%
Digitale strategie
Body
16px / 400 / 0%
Wij bouwen websites die presteren.
Small
14px / 400 / 0%
Aalst · fraai.agency · Frederik & Stefanie
Label
11px / 600 / +12% · UC
01 — the mark
04 — Baseline

Slagzin

Built to perform.
Aanbevolen
Digital that works.
Alternatief
Your digital partner.
Alternatief

"Built to perform." is de aanbevolen baseline. Kort, zelfverzekerd en meetbaar — het vervangt "Creative Web Studio" en sluit aan bij de prestatiegerichte merkpijler. Gebruik in combinatie met het F-beeldmerk of het volledige FRAAI-woordmerk. Verklein de baseline nooit onder 12px in enige toepassing.

05 — Stem & toon

Hoe Fraai klinkt

Zelfverzekerd
Benoem resultaten en capaciteiten direct. Geen twijfel of afzwakkingen. Sta achter de bewering.
Wij bouwen websites die presteren.
Wij proberen websites te leveren die zo goed mogelijk presteren.
Direct
Korte zinnen. Geen agency-jargon. Zeg precies wat je bedoelt in de eenvoudigste bewoordingen.
Snel, veilig, en klaar binnen budget.
Wij bieden een holistische, synergetische aanpak voor uw digitale transformatie.
Warm
Voornamen, echte verhalen, oprechte zorg. Nooit corporate-koud. Je bent nog steeds jezelf — maar dan luider.
Frederik en Stefanie staan zelf garant voor het resultaat.
Ons toegewijd team van experts begeleidt u door het volledige proces.
Gevat
Af en toe droge humor is een kenmerk van Fraai. Gebruik het met mate — één goed geplaatste regel is beter dan vijf geforceerde.
Onze website laadt zo snel dat bezoekers niet eens van tabblad wisselen.
Wij zijn trots op onze vliegensvlugge laadtijden en state-of-the-art technologie.
06 — Gebruik

Do's & don'ts

Do
Gebruik het F-beeldmerk en FRAAI-woordmerk samen
Gebruik Ink of Brand Blue als primaire tekstkleuren
Begin met resultaten — gebruik echte cijfers in copy
Houd de typeschaal consistent; gebruik sectielabels in hoofdletters
Plaats de logo's van Colruyt, DPG Media en mateco hoog op de pagina
Gebruik Terra spaarzaam als een warm, menselijk accent
Schrijf altijd in beginkapitaal (sentence case)
Don't
Plaats het beeldmerk niet op patronen of achtergronden met weinig contrast
Gebruik het oude groene beeldmerk niet als primaire kleurvariant
Gebruik "Creative Web Studio" niet — die baseline is afgeschaft
Gebruik niet meer dan 2 letterdiktes in één paginasectie
Gebruik geen agency-jargon: holistisch, synergie, transformatie
Gebruik Terra niet als achtergrondkleur — uitsluitend als accent
Gebruik GEEN HOOFDLETTERS voor bodytekst of koppen
07 — Logo Do's & Don'ts

Correct gebruik van het beeldmerk

Do
Gebruik het primaire blauwe beeldmerk op lichte of witte achtergronden met voldoende contrast.
Don't
Draai, kantel of vervorm het beeldmerk nooit. Houd het rechtop en in de juiste verhoudingen.
Don't
Plaats het transparante/omgekeerde beeldmerk nooit op drukke of patroonachtergronden.
08 — Fotografie

Beeldrichting

Hoog contrast,
dynamische hoeken.
Team & Cultuur: Authentieke, ongedwongen momenten. Hoog contrast, scherpe focus, met lichte koele ondertonen. Vermijd generieke stockfoto-glimlachen.
Strakke mockups,
ademruimte.
Werk & Cases: Presenteer digitale producten op strakke, neutrale achtergronden (Cream of wit). Zorg voor royale padding rondom apparaten.
09 — UI-elementen

Componentstijlen

Knoppen

Knoppen hebben een hoogte van 48px, een afronding van 8px, en gebruiken 14px Semibold lettertype.

Formuliervelden

Invoervelden komen overeen met de hoogte van knoppen. Ze gebruiken een 1px rand die Brand Blue wordt bij focus.