# Romain Gabin: The Design System (v5.0.0)

> Frontend tech lead with 10+ years of experience, specialized in design systems that scale across frameworks (Vue, React, Angular, Web Components) and in web accessibility (WCAG/RGAA). Built and led "Marcel", Carrefour's multi-framework design system, and raised the e-commerce accessibility score from 36% to 54%. Now focused on AI-assisted development: MCP servers, agent skills, and rethinking design systems for the agentic era, where AI agents are first-class consumers.

This site documents Romain Gabin Malnoult ("Romain Gabin"), a frontend tech lead, using the
metaphor of a design system. All facts are real; the packaging is the joke.

- Title: Tech Lead Frontend: Design Systems, Accessibility & AI-assisted development
- Location: Tours, France (remote-first, occasional travel to Paris)
- Email: romain.malnoult@gmail.com
- LinkedIn: https://www.linkedin.com/in/romainmalnoult/
- Availability: open. Open to freelance engagements and CDI. Remote in France, occasional on-site (Paris). Best fits: design system architecture, accessibility audits and remediation, AI-workflow enablement for frontend teams.
- Languages: French (native); English (fluent, after 2 years in Australia and the US)

## Personal tokens

- --role: tech-lead-frontend. Leads frontend teams: architecture, mentoring, delivery.
- --expertise: design-systems. Builds and runs design systems used by hundreds of developers.
- --conviction: accessibility. Interfaces should work for everyone. WCAG AA is the baseline, not the target.
- --method: agentic-workflows. Works with AI agents daily: coding agents, custom skills, MCP servers. This site was built that way.
- --stack: vue / nuxt. Primary tools since 2016. Also ships React, Angular and Web Components.
- --standard: semantic-html. The right element for the job, then CSS, then JavaScript. In that order.
- --base: tours-france. Remote first, from the Loire Valley. One hour from Paris by TGV.
- --languages: fr, en. Fully bilingual after two years working in Australia and the US.
- --drive: always-shipping. Side projects go to production: a browser DJ, an accessibility guide, a daily weather mood.
- --home: parwine & many. The people behind the work. Many joined the team in June 2026.

## Components (skills)

- <DesignSystems /> (stable, since v4.0.0 (2021)): One source of truth, five frameworks, hundreds of developers.
- <Accessibility /> (stable, since v4.0.0 (2021)): From 36% to 54% RGAA compliance on one of France's largest e-commerce platforms.
- <AIWorkflows /> (stable, since v4.8.0 (2025)): Design systems for the agentic era: AI agents as first-class consumers.
- <CSS /> (stable, since v1.0.0 (2013)): Modern CSS in production: tokens, container queries, native theming.

## Side projects

- [craft-skill](https://github.com/Rmalnoult/craft-skill): A design skill for coding agents (Claude Code, OpenCode). Fights AI-generated sameness: anti-cliché catalog, font tiers, seeded variation, pass/fail self-review.
- [mix-for-free](https://mix-for-free.com): A browser-based DJ app (formerly YouTube DJ). Two decks, crossfader, soundbox. No install, no signup.
- [webforallguide](https://webforallguide.com): A free, practical guide to web accessibility: contrast, semantics, ARIA, keyboard, forms, screen readers.
- [vibe-of-the-day](https://romain.cool): Weather as a mood. A daily forecast for the vibe, not the millibars.
- [ux-dojo](https://ux-dojo.com): Train your UX eye. Practice interface critique like a martial art.
- [tctb](https://tctb.fr): Stripe-certified payment integration studio for SMBs. "Get paid on Stripe. Without the headache."
- [parwine](https://parwine.com): A tarot reading experience built for Parwine. Les étoiles ne mentent jamais. ✦

## Changelog (career)

- v5.0.0 (2026-04): The agentic era @ Atos, Tech Lead AI, Samourai enabling team
- v4.0.0 (2021-10): Marcel & the accessibility years @ Carrefour, Tech Lead, Design System & Accessibility
- v3.2.0 (2020-09): Streaming platforms @ VOD Factory, Web Developer
- v3.0.0 (2019-06): Scale-up years @ Airbnb (Luckey), Lead Web Developer
- v2.5.0 (2016-09): i18n support @ Australia & USA, then Nowly, Tours
- v2.0.0 (2015-08): Full-stack foundations @ Infotech-innov / Freelance, Web Developer
- v1.0.0 (2013-01): Initial release @ Hôtel L'Adresse ⭐⭐⭐⭐, Paris, Receptionist

## Machine-readable endpoints

- [resume.json](https://romaingabin.fr/resume.json): full profile in the JSON Resume schema
- [mcp](https://romaingabin.fr/mcp): MCP server (Streamable HTTP). Tools: get_profile, get_experience, get_projects, get_availability.

## Pages

- [Getting started](https://romaingabin.fr/): introduction and framework support
- [Design tokens](https://romaingabin.fr/tokens): values as live CSS custom properties
- [Side projects](https://romaingabin.fr/components): side projects, all live
- [DesignSystems](https://romaingabin.fr/components/design-systems): Marcel at Carrefour, multi-framework DS
- [Accessibility](https://romaingabin.fr/components/accessibility): WCAG/RGAA work, 36%→54%
- [AIWorkflows](https://romaingabin.fr/components/ai-workflows): MCP servers, agent-first design systems
- [CSS](https://romaingabin.fr/components/css): the craft layer
- [Changelog](https://romaingabin.fr/changelog): career as semver releases
- [For AI agents](https://romaingabin.fr/agents): how machines can consume this site
- [Hire / contact](https://romaingabin.fr/support): availability and engagement types