While many programs maintain their own unique brand identities, the Design System offers a common visual style that you can flexibly apply to a range of government digital platforms. Our visual style offers a clean, modern aesthetic that meets high standards of visual accessibility while promoting credibility, trust, and warmth in the design.
We expect many teams will need to customize this guide, but we encourage you to incorporate as much consistency in look, feel, and usability as you can.
As a complement to this visual style guidance, we strongly recommend you use 18F’s Content Guide when writing language for government services.
The site contains HTML mockups of common UI components designed to follow the U.S. Web Design System’s visual style guide. To view the specs of each design live on this website (padding, margins, stroke weight, line-height, and so on), use your browser’s developer tools.
All of these designs are also available in various file formats, which are available for download:
Retired design files
The following design files are no longer being maintained by the U.S. Web Design System team as of version 1.0.0. The most recent versions remain available for download at the links below. While the Design System team is no longer maintaining these files, we’d love to hear from any teams that are using these files and adding new components when new versions of the Design System is released. Send us an email.
Notes on accessibility
All of our designs meet the WCAG 2.0 AA accessibility guidelines and are compliant with Section 508 of the Rehabilitation Act. If you choose to customize these designs, please make sure they continue to meet the requirements listed in the “Accessibility” section of each design.
We’re glad you’re considering contributing to the Design System — their success relies on contributions from designers like you.
Please visit our wiki to read our full contribution guidelines. Also, please note that every submission we receive goes through a full design review. (Changes that only affect underlying code are reviewed by our developers.)
Questions or comments? Email us and we’ll get back to you as quickly as we can.