Treasury Design System

I joined the Treasury as a product designer during the COVID-19 crisis. Right as the administration was rolling out stimulus programs. My office needed to stand up trustworthy, working software to support these programs asap.

I worked with developers and content strategists who launched several sites in record time. But there was a problem: each team was reinventing the wheel. Different colors, fonts, sizes, and button styles made our sites look inconsistent and unprofessional.

My creative director and I remixed the U.S. Web Design System to help our teams ship quality software faster. Our version has official branding, a library of accessible components, and a detailed user guide. Over a dozen projects (and many internal applications) use it, but you can see it in action on treasury.gov or bep.gov.

Cover and Headings pages of the Treasury Design System.
Buttons and Cards pages of the Treasury Design System.
a screenshot of a Treasury webpage outlining policy issues and the Inflation Reduction Act.
a screenshot of the Treasury design system documentation outlining how to use brand colors.
a screenshot of the Treasury design system documentation outlining how to use form controls alongside the bep.gov home page.
a mockup of someone visiting the treasury.gov website.
 

Results

Back to Home