React Dsfr
React Dsfr is a free, open-source design system built with React, Next.js and Material UI. 🇫🇷 The French Government Design system React toolkit. It has 497 GitHub stars and is released under the MIT license. A live demo is linked from this page.
github.com/codegouvfr/react-dsfr (opens in a new tab)
Data as of from the GitHub API; description from the project's repository. Report an error
Get started
Copy the files into a new folder with degit (no git history), or clone the repository with git.
npx degit codegouvfr/react-dsfr my-ui
cd my-ui
npm install # then run the dev script from the READMEgit clone --depth 1 https://github.com/codegouvfr/react-dsfr.git my-uiSources: GitHub docs on template repositories, degit.
About React Dsfr
WARNING: This Design System is only meant to be used for official French's public service websites. Its main purpose is to make it easy to identify governmental websites for citizens. See terms.
Built with
- React
- Next.js
- Material UI
- TypeScript
Similar templates
More design systems
Appica UI
appica-dev/appica-ui
A beautifully styled UI component library for building accessible, modern web applications and scalable design systems.
Active · last commit Oct 12, 2026
Design systemsTypeScriptPaste
twilio-labs/paste
Paste is a design system for designing and building consistent experiences at Twilio.
Maintained · last commit Aug 20, 2026
OfficialDesign systemsTypeScriptDesign System
hashicorp/design-system
The Helios Design System provides the building blocks to design and implement consistent, accessible, and delightful product experiences across HashiCorp.
Active · last commit Oct 28, 2026
OfficialDesign systemsTypeScriptPrimitives
primer/primitives
Color, typography, and spacing primitives in json.
Active · last commit Oct 21, 2026
Design systemsTypeScriptOfficial Design Md
VoltAgent/official-design-md
Official DESIGN.md files published by companies themselves.
Maintained · last commit Sep 21, 2026
OfficialDesign systemsPatternfly Elements
patternfly/patternfly-elements
PatternFly Elements. A set of community-created web components based on PatternFly design.
Maintained · last commit May 5, 2026
Design systemsTypeScript
How do I use React Dsfr?
Copy the files into a new folder with npx degit codegouvfr/react-dsfr my-ui (no git history), or fork the repository on GitHub. Then follow the README for the install and dev commands.
Can I use React Dsfr for commercial projects?
Yes. React Dsfr is released under the MIT license, a permissive license that allows commercial use as long as you keep the copyright and license notice. Third-party assets bundled with it (images, fonts, icons) may have their own terms.
Is React Dsfr maintained?
The repository's most recent commit was on Oct 15, 2026. Its latest release is v1.36.0. appsgit only lists templates from repositories with a commit in the last six months.