The U.S. Web Design System (USWDS) lets you focus on what really matters. It speeds up your work by providing proven, accessible, and compliant code from the start.
Why use USWDS
Build faster. Create great user experiences tailored to your users needs. You don’t need to build common UI elements, icons, fonts, or even tokens from scratch.
Accessible and reliable. USWDS is designed and proven to meet accessibility standards, like Section 508 and WCAG 2.1 AA from the start, with no extra effort.
Users first. Provide experiences that are intuitive and build trust by using plain language, UX research, and human-centered design principles.
Consistency. Build interfaces with a shared language. This ensures consistency across all your products.
Easier updates and less debt. Avoid technical debt by updating USWDS and improving multiple things at once. Onboarding is faster with clear guidance for immediate impact.
If you’re not ready to touch code you can use the principles or guidance to jump start and improve your work.
The 21st Century IDEA act requires teams to create digital-first experiences for the public that are accessible, user-centered, plain language, and more. Meeting these requirements can be a lot of work. A lot of this already aligns with USWDS principles.
Before code or components, the USWDS Design Principles are a solid foundation for building effective digital products.
Start with real user needs. Research and test your products with real users.
Earn trust. Don’t assume users will trust you just because you’re a government site. Work like you’re gaining their trust every single time. Using plain language is crucial.
Embrace accessibility. Build accessibility into everything you do, this includes code, presentations, guidance, slides, spreadsheets.
Promote continuity. Minimize disruptions, be consistent, and build for the big picture, instead of single, one-off tasks. This is especially important as you support more products.
Listen. Always be open to feedback and learn how people use your product to improve it.
These are proven principles that you can adopt into your work to build trustworthy, accessible, and user-friendly products. Even if you don’t have a design system or plan to create one.
Plain Language Check
Be an expert, without sounding like a robot.
Before
Voters whose registration is active at their residence will receive a full ballot which includes all offices and public requests applicable to that address.
After
If you are registered at your current address, you will receive a full ballot that includes all offices and issues for your location.
One of USWDS’s greatest features is its flexibility. You don’t have to adopt everything all at once. The USWDS maturity model is a clear path to incremental adoption.
Take advantage of this flexibility to get a head start. Integrate at your own pace and team abilities. Here are the 3 levels from the maturity model showing how you can get started:
Principles. Apply the design principles from the start.
Use research to inform decisions.
Be inclusive and test with a wide range of abilities.
Ensure content is in plain language.
Think about accessibility at all levels
For example, in presentations, number slides and announce them, describe images, and provide captions and transcriptions if possible.
Provide ways for folks to give feedback.
Guidance. Follow UX guidance for core elements like buttons, forms, and patterns.
Apply the guidance to your own components, like when to use, when to avoid, usability, and accessibility.
Follow the accessibility checklist and ensure your custom components meet the criteria.
Follow USWDS patterns to ensure you’re meeting best practices for common user interactions.
Code. You don’t have to adopt everything all at once. Here are a few ways you can use USWDS code to get a head start:
Use core code (functions & mixins), icons, and fonts to create your own design identity.
Use tokens in styles or use them to create entirely new components.
Create a base theme using USWDS theme settings.
Gradually replace custom components with USWDS components that are customizable, accessible, and meet compliance. This is a great way to improve consistency and reduce technical debt.