Foubert merk

Kleuren COLOURS

The official swatch file FOUBERT_SWATCHES.ase (brand refresh 2025, Lichterlaaie Studio) is the source of truth for colours. Website-only screen colours are listed separately under `screen`. decision-2026-10-14

The ASE stores Pantone swatches without colour names; they were matched to the colours by order. Brand book p.12–13 prints the same PMS number next to every colour, which confirms that mapping. brand-colours-report; brandbook p.12-13

Officiële kleuren · official (ASE)

Schermkleuren website · screen colours (not in the ASE)

Website screen colours, not in the ASE. Use on screen only; there is no CMYK/Pantone for them.

Gebruik · usage

• All full colours share the same tonal strength; the 50% tints are supporting colours. brandbook p.12
• Red, brown and tan are the three corporate colours used in the logo: the wordmark is full red, as is the top half of the scoop; the bottom half of the scoop is 50% red; the cone is 50% tan; the taglines are brown. brandbook p.12
• The extra palette of soft tints (yellow, orange, purple, blue, green) keeps designs with scoops from getting too busy and supports a calm, consistent premium feel. brandbook p.13
• gezien in toepassing Colour proportions are not specified in numbers. Page 12 shows red as by far the largest block, brown and tan smaller. brandbook p.12
• Website: red for header, hero and CTAs; brown for headings, rules, footer and the running band; cream page background. handoff §4.1; tokens
• No hard-coded colours outside the tokens on the website (except data colours such as flavour colours). Old values #f5323c, #643200, #ebd2b9, #2d1f1a, rgba(235,210,185,…) are replaced by tokens. page-brief Design language

Contrast (WCAG)

WCAG 2.x contrast ratios (computed from the hex values; the build re-checks them). AA normal text needs 4.5, AA large text (≥24px, or ≥18.66px bold) and UI parts need 3.0, AAA normal text needs 7.0.

Bolletjes SCOOPS

A scoop is always a full sphere made of two halves of the same colour: the darker half on top, the lighter half below. Never a lone half-sphere. handoff §4.1; ds-readme Two hard brand rules

• In the logo the scoop is 100% red (top) over 50% red (bottom), on a 50% tan cone. brandbook p.12
• Scoop pairs are the ASE 100% / 50% pairs. tokens scoopPairs; decision-2026-10-14
• CSS: linear-gradient(to bottom, DARK 0 50%, LIGHT 50% 100%), rotated -18°. Fallback order when a flavour has no usable colour: pink, tan, mint, yellow, blue, orange, red. handoff §4.1; tokens scoopGradient, scoopFallbackOrder
• The cone under a scoop is a tan triangle (50% tan in the logo). brandbook p.12; handoff §4.1 (tan-100 = cone triangle)

Typografie TYPOGRAPHY

Section opener: a script line (Morning Memories) in brown, with one CAPS word (Pulp Display 800) in red below or behind it. Use it for the main sections of every page; the CAPS word is one short word, the script carries the rest. Use the existing heading text, do not invent copy. handoff §4.2; page-brief Design language

Rollen op de website · roles

Hoofdletters · casing

• The wordmark is always lowercase 'foubert' (it is a logo file, never retyped). brandbook p.3; media-catalog logos
• gezien in toepassing Product and category headings in print are CAPS (PANNENKOEKEN, FONDUE, BROWNIES); product names in menu lists are lowercase (bloemsuiker, aardbei, fondant). brandbook p.22; menu-ss26 p.4-8
• Eyebrows, nav and CAPS words are uppercase with letter-spacing (0.14–0.22em). handoff §4.2

Niet doen · don't

• Do not use Inter, Roboto or system fonts as the main font. handoff §4.2
• Do not set old hero titles inline in Morning Memories; use the page hero (script/caps). page-brief Design language
• Morning Memories is never used for body copy. ds-readme Typography

Logo's LOGOS

logo · full pos

Logo (primary)

Wordmark 'foubert' with the cone as the 'o'. The most practical choice for most applications. Taglines usually work better elsewhere and in another typeface than anchored in the logo.

15 bestanden · bekijk alle varianten

brandbook p.3, p.4

badge · full pos

Badge (secondary)

The logo with the taglines PANCAKES (above) and ICE CREAM (below) set in an arc. Gives extra context where there is no other design, and strengthens the artisanal feel.

14 bestanden · bekijk alle varianten

brandbook p.4

brandmark · full pos

Brandmark

The scoop and cone on their own (portrait file, 3093 × 5000). Not shown separately in brand book V3; it exists as a file in the brand refresh logo set. Not to be used as the website header logo.

14 bestanden · bekijk alle varianten

media-catalog foubert-logos-brandmark-full-pos; handoff §10

logo-15 · full pos

Anniversary logo (15 years)

Combines the core shapes of the brandmark in a festive variant: the cone is replaced by a balloon with dots. Together with the main logo it forms 'a strong duo' that reinforces the new branding.

14 bestanden · bekijk alle varianten

brandbook p.4

badge-15 · full pos

Anniversary badge

Anniversary logo with '15 YEARS' (above) and 'HAPPINESS' (below) in an arc.

14 bestanden · bekijk alle varianten

brandbook p.4, p.36

Versies · versions

• Positive (full colour): Light backgrounds (cream, white). First choice. brandbook p.4
• Negative (full colour): Dark backgrounds; keeps the warm look: pink and beige stay, the red becomes white for contrast and legibility. Shown on red in the brand book. brandbook p.5
• Tinted: Gradations of one colour, for a subtler fit on busier, colourful backgrounds. Shown in tan on brown. Colours: black, brown, pink, red, tan, white. brandbook p.6; media-catalog logos
• Monochrome: Strongly simplified, one solid colour. For applications that must be single-colour, such as a stamp, fax or waffle. Shown in tan on black. Colours: black, brown, pink, red, tan, white. brandbook p.7; media-catalog logos

Welk logo op welke achtergrond · which logo on which background

light → full-pos

logo · full pos

Primary logo or badge in full colour.

brandbook p.4

red → full-neg, mono-white

logo · full neglogo · mono white

Brand book shows the negative full-colour version on red; the website header uses the white mono logo on red.

brandbook p.5; handoff §4.3, §10

brown → tint-tan, mono-white

logo · mono whitelogo · tint tan

Brand book shows the tinted tan version on brown; the website footer uses a large white logo on brown.

brandbook p.6; handoff §4.3, §10

dark → mono-tan, full-neg

logo · full neglogo · mono tan

Brand book shows mono tan on black; the negative version is described for dark backgrounds.

brandbook p.5, p.7

photo → tint

logo · tint blacklogo · tint brownlogo · tint pinklogo · tint redlogo · tint tanlogo · tint white

Tinted versions are meant for busier, colourful backgrounds. The brand book does not say which tint colour to choose; pick the one that contrasts with the photo. No other photo rule is given.

brandbook p.6

single-colour → mono

logo · mono blacklogo · mono brownlogo · mono pinklogo · mono redlogo · mono tanlogo · mono white

Single-ink applications.

brandbook p.7

chocolate-plate → mono

logo · mono blacklogo · mono brownlogo · mono pinklogo · mono redlogo · mono tanlogo · mono white

The brand book shows the badge in one colour on chocolate plates: dark and milk chocolate printed in 'MUSTARD YE65', white chocolate in 'SEPIA BROWN BR50O' (colour codes as printed in the brand book).

brandbook p.38

Witruimte en minimale grootte · clear space and minimum size

• Not specified in brand book V3 (no clear-space page). brandbook p.1-39
• Not specified in brand book V3 (no minimum-size page). brandbook p.1-39

Niet doen · don'ts

• Never distort or recolour the logo; use the files unchanged (reuse: false). media-catalog logos (license, reuse: false)
• Use the variant that matches the background instead of changing the logo. media-catalog logos notes
• Do not use the brandmark (portrait, cone only) as the header logo. handoff §10
• Never stretched or tinted with non-brand colours; the full-colour positive is the first choice, negative and mono only where the main colours are not possible. ds-readme Layout rules; ds-readme Logo
• Brand book V3 has no don'ts page. brandbook p.1-39

Toon TONE OF VOICE

• Warm, playful, close by: the brand speaks as 'we' (wij/we) to one person. locales nl/salon.json openingstijden.subtitle; menu-ss26 p.3; ds-readme CONTENT FUNDAMENTALS
• Short, concrete sentences; name the real product or ingredient (Callebaut chocolate, Belgian strawberries, lokale melk). locales nl/home.json intro.text2; locales nl/home.json pancakes.intro; menu-ss26 p.3
• Handwritten English one-liners about ice cream, pancakes, coffee and mood carry the humour. brandbook p.16, p.18, p.25; menu-ss26 p.5, p.8, p.13, p.15, p.23, p.24
• No emoji; the brand uses scoops, doodles and real photography instead. handoff §10; ds-readme Emoji
• Always foubert.eu as the web address. ds-readme Two hard brand rules

Merkzinnen · brand phrases

These phrases stay in English in every language (website, cups, menu booklet). handoff §7; page-brief Texts and translations

• Have a flippin' great day!pancake section opener (website home.pancakes.script + DAY), menu booklet pancakes pagemenu-ss26 p.8; locales nl/home.json pancakes.script; brandbook p.22
• Today's good mood is sponsored by coffee.coffee page of the menu booklet, website quote bandmenu-ss26 p.15; locales nl/home.json quote
• See you soon!reservation confirmation on the website (hard-coded, not a locale key)website ReservationCard.jsx:90, Reserveren.jsx:39
• Have an ice DAYmenu booklet openermenu-ss26 p.2; menu-aw25 p.2
• Never settle for just one scoop.menu booklet; cupsmenu-ss26 p.5; brandbook p.25
• We make suggestions, you make decisions.menu booklet suggestions pagemenu-ss26 p.13
• Ice cream is cheaper than therapy.cupsbrandbook p.25
• A balanced diet is a cup in both hands.cupsbrandbook p.25
• Please don't lick our window / t-shirt / menu / brand book / ICE CREAM truck.window vinyl, t-shirt, menu back, brand book cover, truck sidebrandbook p.1, p.16, p.18, p.31, p.32; menu-ss26 p.24
• Please do lick our socials.menu booklet socials pagemenu-ss26 p.23
• Stay the NIGHTmenu booklet loft pagemenu-ss26 p.18; brandbook p.21
• New year, new diet.WI25 folder backfolder-wi25 p.1; brandbook p.26
• All I want for christmas is ne frisco.WI25 folderfolder-wi25 p.2

Nederlandse uitzonderingen · Dutch exceptions

• gezien in toepassing Book deze ijskar voor JE FEEST (truck rear (mockup)) brandbook p.33
• gezien in toepassing OPGELET VOOR ONZE KLEINE KLANTJES (truck rear (mockup)) brandbook p.33
• gezien in toepassing Winter MAGIE (WI25 folder cover) brandbook p.26

Niet doen · don't

• Do not translate the English brand phrases. handoff §7
• Do not invent prices, hours, names, counts, reviews or years. handoff §0; page-brief Hard rules
• No emoji as icons. handoff §10; page-brief Design language

Vormen & DESIGN RULES

Vormen · shapes

• gezien in toepassing Visual language of scoops (circles in two halves), tan cone triangles and loose triangles as confetti on packaging, menus, vehicles and signage. brandbook p.15-38
• Free-standing photos on the website are round (RoundPhoto) with at most 2 confetti shapes (can be switched off). Galleries and grids may stay rectangular with radius 24. handoff §4.3; page-brief Design language
• No gradients other than scoops, no glassmorphism, no heavy shadows, no emoji as icons. page-brief Design language

Beweging · motion

• Animation only for the running band (marquee): translateX(0 → -50%), linear, infinite, 40s; stopped with prefers-reduced-motion. handoff §4.3, §4.4
• No bounce. Entrances at most a fade + 4px up in 260ms. handoff §4.4; page-brief Design language
• Press: scale(0.98). handoff §4.4

Interactie · interaction

• Hover on buttons: red → #D92E3B; cream → brown with white text. List rows: hover turns the text red. handoff §4.4
• Focus: 2px outline #F5323C (handoff says #F4303C, replaced by the ASE red) with 2px offset. handoff §4.4; decision-2026-10-14
• Buttons are pills: primary red (contained), secondary brown outline; on red use the onRed variants. page-brief Design language

Layout

• Spacing base 4px. Page margin clamp(16px, 3vw, 40px), section padding clamp(56px, 7vw, 112px), max width 1360px. handoff §4.1; tokens layout
• Page = red hero at the top (exactly one h1), then cream sections; alternate bands may use cream-2, pink-light or brown with cream text. page-brief Design language
• Header: sticky, red background, white logo, caps nav, language switch and a cream pill button 'Reserveer'. Footer: brown, large white logo. handoff §4.3
• All grids: repeat(auto-fit, minmax(min(100%, Xpx), 1fr)). Below 768px everything stacks, and a sticky bottom bar appears (carts/table in summer, table/webshop in winter). handoff §4.4

Toegankelijkheid · accessibility

• Tap targets at least 44px everywhere. handoff §4.4
• Exactly one h1 per page, logical h2/h3 order, descriptive alt texts. page-brief SEO
• No horizontal overflow at 390px. page-brief Design language
• Respect prefers-reduced-motion (marquee stops). handoff §4.3
• Check contrast: white or red text on red/cream is for large text only (see colors.contrast). colors.contrast

Iconen · icons

• The brand has no icon set. Use the MUI icons already in the website, for functional UI only. No emoji (replace by scoops). handoff §10

Seizoenen SEASONS

• The website has two modes, decided astronomically: spring/summer from the March equinox up to the day before the September equinox; fall/winter from the September equinox up to the day before the March equinox (Europe/Brussels date; the equinox day is the first day of the new season). season-js; handoff §3
• The ice cream carts drive from 1 March up to and including 15 October. Everything about the carts follows this (nav order, 'Terug in de lente', the IJskarren banner, the mobile bar); the hero and salon hours keep the astronomical season. season-js CART_SEASON
• Print runs per season: menu booklets AW25 (autumn/winter 2025) and SS26 (spring/summer 2026), winter folder WI25. media-catalog documenten; folder-wi25

15 jaar · anniversary

• Foubert exists since 2010 ('Sinds 2010 zijn we bij Foubert gespecialiseerd in heerlijk ijs en fantastische pannenkoeken'). menu-ss26 p.3; locales nl/salon.json hero.subtitle
• 15-year anniversary logo and badge ('15 YEARS' / 'HAPPINESS') form a duo with the main logo. brandbook p.4-7
• gezien in toepassing Applied on a tote bag, a waffle and digital signage. brandbook p.16, p.36
• No source says until when the anniversary logo should be used. brandbook p.4

Beeld PHOTOGRAPHY

Brand book V3 has no written photography or illustration rules.

• gezien in toepassing Real food and product photography; products (cones, cups, tubs) shot floating or standing on flat backgrounds in the tertiary colours (pink, blue, tan, yellow). brandbook p.24, p.25, p.29, p.30, p.37
• gezien in toepassing In print (menus, folders) photos are cropped into circles and arcs, combined with tan triangles. brandbook p.20-23, p.26-28
• gezien in toepassing Lifestyle shots with people wearing merchandise (tote, t-shirt, caps). brandbook p.16, p.18

Personen · people

• Recognisable people only with registered consent; children never without written parental consent. media-readme Personen en toestemming

Enkel in de design-system README · design-system README only

• Warm, natural daylight, close-up food macros and candid people shots; no grey, dramatic or studio-cold light; food not centred. Not in the brand book; not verified with Foubert. ds-readme Backgrounds & imagery

Tegenstrijdig CONFLICTS

Waar bronnen elkaar tegenspreken, staat hier wat elke bron zegt. Niets is gekozen, behalve de kleuren (ASE).

Andere OTHER BRANDS

Bronnen SOURCES

• ase FOUBERT_SWATCHES.ase (brand refresh 2025, Lichterlaaie Studio, 5/2/2025)
  Drive FOUBERT/00740102 BRAND REFRESH/SWATCHES/FOUBERT_SWATCHES.ase – Source of truth for colours
• brand-colours-report Huisstijlkleuren Foubert (ASE read-out)
  reports/brand-colours.md
• decision-2026-10-14 Decision Foubert 14/10/2026: the ASE is the source of truth for colours
  website tokens.js header; media library style.css header
• brandbook Lichterlaaie × Foubert Brand Book V3 (08/01/2026)
  Drive FOUBERT/00740101 BRAND BOOK/00740101_FOU_BRANDBOOK_V3.pdf – 39 PDF pages: 1 cover, 2–7 brand architecture (logos), 8–13 brand elements (fonts, colours), 14–38 applications (mockups, no text rules), 39 agency contact. Page numbers here are PDF pages.
• handoff Handoff foubert.eu redesign (13/10/2026)
  fouberteu-redesign/docs/redesign/HANDOFF.md
• page-brief Page restyle brief (Poster redesign)
  fouberteu-redesign/docs/redesign/PAGE_BRIEF.md
• tokens Foubert Design System tokens
  fouberteu-redesign/frontend/src/theme/tokens.js
• season-js Season helper
  fouberteu-redesign/frontend/src/utils/season.js
• ds-readme Foubert Design System README (generated design-system kit, made without the brand book PDF)
  design_handoff_foubert_redesign/designs/_ds/foubert-design-system-*/README.md – Lower authority: several statements contradict the brand book and the logo files.
• locales Website copy (nl/en/fr)
  fouberteu-redesign/frontend/public/locales/{nl,en,fr}/*.json
• website Website components
  fouberteu-redesign/frontend/src
• menu-ss26 Menu booklet spring/summer 2026 (Lichterlaaie)
  Drive FOUBERT/00741004 MENU BOOKLETS/0003 SPRING SUMMER 2026/00741004_FOU_MENUBOOKLET_SS26_LR.pdf
• menu-aw25 Menu booklet autumn/winter 2025 (Lichterlaaie)
  Drive FOUBERT/00741004 MENU BOOKLETS/0002 AUTUMN WINTER 2025/00741004_FOU_MENUBOOKLET_AW25_LR.pdf
• folder-wi25 Winter folder WI25 (Lichterlaaie)
  Drive FOUBERT/00740902 FOLDERS/00740902_FOU_FOLDER_WI25_LR.pdf
• vocab Media library vocabularies
  vocab.yaml
• media-catalog Media library catalog (logo files and their metadata)
  catalog/logos/*.yaml → dist/catalog.json
• media-readme Media library README
  README.md
• colors.contrast This file, section colors.contrast
  brand/foubert.yaml