Use the DfE Design System to ensure products and services, built in the Department for Education, provide people with a consistent, accessible, and usable user experience.
If you've never used the DfE design system before, read through the following guidance first:
When to use
Understand when to use DfE Frontend in your products.
Installation
How to install and use DfE Frontend in your product.
Contribute
How to contribute a style, component or pattern to the design system
Content design
Our content standards and guidance for tone of voice, the words we use, and writing content strategies for services.
Content design in DfE
How we design good content in DfE for differnet channels and purposes.
Content style guide
The style guide is for anyone creating content for DfE, to help make things clear and consistent across all of our services.
Content strategies
How to create a content strategy to ensure a seamless user experience, efficient content planning, and effective collaboration.
Additional guidance
Guidance for writing content in other services or products.
Should your content go on GOV.UK?
Use the quick tool to understand where your content should be published and your next steps.
Prototyping
Guides to help you get started with the design system and to design, build, and test your products.
Figma
Use the DfE Frontend library in your Figma designs.
Prototype kit
Get started with the prototype kit and get it set up.
Hosting your prototype
How to set up your prototype and using Heroku.
Other DfE design systems
These design systems are specific to certain services and products within DfE.
We're open source
DfE Frontend is available open-source on GitHub. You're welcome to contribute, provide feedback, or pick up helping us with our backlog.
Keep up to date
We write about, and share as much as we can, in the open. You can find out more about what we're doing on the following channels:
Found a problem?
If you've found something wrong, or found a bug, raise an issue and we'll look into it.