VA Design System: Color Palette

What it is

The color palette page of the VA Design System, the standard for the U.S. Department of Veterans Affairs' websites and apps, captured with a release banner dated August 2026. It sets out a layered token structure. Semantic tokens say how a color is used and are grouped by concept: text and icons, link, base, primary, primary alt, secondary, info, success, warning, error, background, hub, emergency and accent. Primitive tokens are the raw palette, a subset of U.S. Web Design System colors plus VA's own custom primitives, and the page says they should not be used directly. Component tokens are scoped to single components such as alert, button, input, label, link and process list. A last group, concept tokens, came from VA's native mobile app and has not been adopted on the web. The swatches and color values were not captured.

Why read it now

The page is thin, but the rule it states is the part worth taking: pick a color by its job, not by its shade. A designer asks for error or link, and the semantic token points to whichever raw color fills that role. This is now standard practice; the W3C Design Tokens Community Group format and large systems such as Material and Salesforce Lightning also separate raw values from role tokens. For a marketing team the gain is control. When a brand color changes, or a campaign needs a seasonal accent, you edit one mapping instead of hunting through every page and template, and you stop the drift where five near-identical blues appear across one site. What is missing: no hex values, no contrast pairs, no examples, so it cannot serve as a reference alone; read it with the USWDS color page it inherits from. The admission that the mobile app's tokens never reached the web is an honest record of how systems split. Use: list your brand colors by role, such as text, link, action, warning and background, before you list them by shade.

Passages worth keeping

Read the original design.va.gov