How to use for designers

VACDS offers a flexible yet coherent visual style you can apply to any clinical app or website. Using the clean, modern visual styling of USWDS, the goal is to meet the high standards of usability and accessibility while promoting credibility and trust.

For more information on the VACDS system styles and palettes see design tokens.

For information on content guidelines and accessibility, see our page for VA content guidelines.

VACDS for designers

This documentation site offers mockups and common UI components following the USWDS visual style guide.

VACDS components and tokens are available in our VACDS Figma file. These components have been tested by our team and are ready to be used in your design work.

Follow the link to our published VACDS Figma Library that you can access.

Once you are in the VACDS Figma file, these are the two steps you should follow to use these components and styles:

To use our color and text styles, they will need to be added to your library of local styles. The color and text styles are below for you to add. For information on how to add text and color styles, view this tutorial on adding/creating styles.
To use components from this file, you can copy them from this file into your own file. Updates made in this file will be pushed to your copied styles. You will be notified when there are updates.