Carrefour — Marcel Design System
Marcel (Publicis)
01 — Context
Managing and building the design systems for one of the leaders in retail worldwide. The project spans B2C, B2B, and B2E products across multiple brands, markets, and devices — creating a single source of truth for 50+ products.
Carrefour's digital ecosystem had grown organically through acquisitions and independent product teams. Each team built components from scratch, leading to inconsistent UIs, duplicated effort, and a fragmented brand experience across countries and platforms.
Without a unified design system, development time was 60% longer than necessary.
Component library overview — tokens, components, patterns
02 — Process
Audit & Discovery
Mapped existing components across 50+ products, identified inconsistencies and duplicated patterns, and interviewed stakeholders from each product team.
Token Foundation
Defined the design token architecture — colors, typography, spacing, elevation — with multi-brand theming support built in from day one.
Component Build
Designed and developed 200+ components in Figma and React, with accessibility baked in (WCAG AA) and automated visual regression tests.
Documentation & Rollout
Created comprehensive docs, onboarding guides, and a governance model. Rolled out to product teams with hands-on training sessions.
03 — Solution
We designed and implemented a comprehensive, multi-brand design system with shared foundations — tokens, typography, spacing — and brand-specific theming layers. The system supports light/dark modes, RTL layouts, and responsive breakpoints out of the box.
Multi-brand token architecture with theme switching. 200+ accessible components (WCAG AA). Figma-to-code pipeline with automated sync. Comprehensive documentation & onboarding guides. Performance budgets enforced per component.
04 — Results
Next
Malt — Joy Design System
Malt
