About
What's new?
What’s Changed
- Update complete-a-sub-task.md: Fixing typo by @Lauren-Vocke in #6844
- Update links.md: Updating link text and new tab guidance by @Lauren-Vocke in #6752
- 📊 Update metrics dashboard data - 2026-08-21 by @Amy-Leadem in #6856
- Metrics: Removes governance page link and disables its workflow updates by @Matthew-Dingee in #6811
- 📊 Update pattern adherence data - 2026-08-24 by @Amy-Leadem in #6857
- Chore(deps): Bump the va-design-system-libraries group with 2 updates by @dependabot[bot] in #6858
- Focus documentation: HTML updates by @Barbara-Denney in #6886
- 📊 Update metrics dashboard data - 2026-08-28 by @Amy-Leadem in #6921
- Dates: Converts screenshots to HTML examples by @Barbara-Denney in #6897
- Email address: Converts screenshot to HTML example by @Barbara-Denney in #6898
- Files: Converts screenshots to HTML examples by @Barbara-Denney in #6900
- Update prefilled information: Replace screenshots with HTML examples and add Cancel button by @Barbara-Denney in #6558
- 📊 Update pattern adherence data - 2026-08-31 by @Amy-Leadem in #6922
- Housing status: Converts screenshots to HTML examples by @Barbara-Denney in #6901
- Chore(deps): Bump browserslist from 4.26.2 to 4.28.8 by @dependabot[bot] in #6937
- Adds conflict check, and writing guidance to ADR Skill by @Jeana-Clark in #6920
- Tag - Status: add Neutral status guidance by @Barbara-Denney in #6869
- Phone numbers: Converts screenshots to HTML examples by @Barbara-Denney in #6899
- Marital information: Converts screenshots to HTML examples by @Barbara-Denney in #6902
- Side navigation: Converts screenshots to HTML examples by @Barbara-Denney in #6905
- Mutually exclusive answer pattern: Converts screenshot to HTML example by @Barbara-Denney in #6909
- Contact preferences pattern: Converts screenshot to HTML example by @Barbara-Denney in #6910
- Direct deposit pattern: Converts screenshots to HTML examples by @Barbara-Denney in #6911
- Race and ethnicity pattern: Converts screenshot to HTML example by @Barbara-Denney in #6912
- Service history pattern: Converts screenshots to HTML examples by @Barbara-Denney in #6913
- Check personal information pattern: Converts screenshots to HTML examples by @Barbara-Denney in #6914
- Create june-2026.md: Creating June-Aug 2026 content updates files by @Lauren-Vocke in #6574
- Forms confirmation template: Converts screenshot to HTML example by @Barbara-Denney in #6918
- Chore(deps): Bump @department-of-veterans-affairs/component-library from 56.11.0 to 56.12.0 in the va-design-system-libraries group by @dependabot[bot] in #6963
- Update dont-use-idioms.md: Adding euphemisms and colloquialisms by @Lauren-Vocke in #6954
- Navigate benefit applications pattern: Converts screenshots to HTML examples by @Barbara-Denney in #6916
- Add screenshot-to-HTML migration skill by @Barbara-Denney in #6952
- Address block: Converts screenshots to HTML examples by @Barbara-Denney in #6951
- Update 00_word-list.md: Adding and updating entries by @Lauren-Vocke in #6959
- Update page-titles-and-section-titles.md: Adding info on unique secti… by @Lauren-Vocke in #6955
- Chore(deps): Bump js-yaml from 3.15.1 to 3.15.2 by @dependabot[bot] in #6980
- Process list: Converts VEAP benefits screenshot to HTML example by @Barbara-Denney in #6981
- Privacy agreement: Converts production instance screenshot to HTML example by @Barbara-Denney in #6977
- Checkbox/Radio: Converts relationship-to-Veteran error screenshot to HTML example by @Barbara-Denney in #6976
- Card Status: Converts screenshots to live coded examples by @Barbara-Denney in #6975
- Button: Replaces screenshot with live coded example by @Barbara-Denney in #6967
- List: Converts 5 production screenshots to HTML examples by @Barbara-Denney in #6979
- Summary box: Converts eligibility screenshot to HTML example by @Barbara-Denney in #6984
- Update dont-use-idioms.md: Fixing typos by @Lauren-Vocke in #6986
- 📊 Update metrics dashboard data - 2026-09-11 by @Amy-Leadem in #7006
- Update _config.yml: Modify exclude patterns for HTML includes by @DANIEL-BRADY in #7015
- Patterns: Adds complete a form that needs a second signer pattern by @Barbara-Denney in #6469
- Update prefilled information: Adds address validation on submit by @Barbara-Denney in #6733
- Bump component-library and css-library package numbers by @Ryan-Munsch in #7019
- 📊 Update pattern adherence data - 2026-09-07 by @Amy-Leadem in #6972
- 📊 Update pattern adherence data - 2026-09-14 by @Amy-Leadem in #7010
- Card: Converts screenshots to live coded examples by @Barbara-Denney in #6970
- Screenshot-to-HTML skill: add accessibility and button/link conversion guidance by @Barbara-Denney in #7003
- Names pattern: Converts screenshot example to live HTML mockup by @Barbara-Denney in #7004
- Relationship pattern: Converts screenshot example to live HTML mockup by @Barbara-Denney in #7005
- Signature: Replaces screenshot with Storybook preview by @Barbara-Denney in #7007
- Identify who is filling out a form: Converts screenshots to live HTML mockups by @Barbara-Denney in #7008
- Update readability-and-usability.md: Adding PDF guidance by @Lauren-Vocke in #6964
- Update component-library version number for v56.14.0 release by @Ryan-Munsch in #7053
- feat: update release workflow and improve component library display by @DANIEL-BRADY in #6961
Full Changelog: https://va.ghe.com/software/vets-design-system-documentation/compare/2026-08-31-2…2026-09-17
What’s Changed
- Icons: Added new laptop/computer and monitor heart icon by @DANIEL-BRADY in #6750
- generate dashboard for omb expiration and templates by @Dominic-Padula in #6667
- Icons: clarify Material Icons vs. Material Symbols by @DANIEL-BRADY in #6753
- Design tokens: Adds the 12 tokens new in css-library 0.34.1 by @DANIEL-BRADY in #6773
- Chore(deps): Bump js-yaml from 3.15.0 to 3.15.1 by @dependabot[bot] in #6784
- Chore(deps): Bump @department-of-veterans-affairs/component-library from 56.9.0 to 56.10.0 in the va-design-system-libraries group across 1 directory by @dependabot[bot] in #6800
- Chore(deps): Bump @department-of-veterans-affairs/component-library from 56.10.0 to 56.10.1 in the va-design-system-libraries group by @dependabot[bot] in #6803
- 📊 Update metrics dashboard data - 2026-08-07 by @Amy-Leadem in #6801
- Design token migration: Fixes the trend chart resetting on a css-library bump by @Robert-Hasselle in #6805
- Metrics: Adds July 2026 monthly analytics report by @Matthew-Dingee in #6734
- 📊 Update pattern adherence data - 2026-08-10 by @Amy-Leadem in #6802
- 📊 Update metrics dashboard data - 2026-08-14 by @Amy-Leadem in #6828
- 📊 Update pattern adherence data - 2026-08-17 by @Amy-Leadem in #6831
Full Changelog: https://va.ghe.com/software/vets-design-system-documentation/compare/2026-08-31…2026-08-31-2
What’s Changed
- chore: update releases for Sprint 3 by @Amy-Leadem in #6611
- Links: Simplify link opening behavior documentation by @Barbara-Denney in #6513
- va-button: Adds custom behavior guidance by @Jeana-Clark in #6614
- 📊 Update metrics dashboard data - 2026-07-03 by @Amy-Leadem in #6579
- Chore(deps): Bump the va-design-system-libraries group across 1 directory with 2 updates by @dependabot[bot] in #6629
- 📊 Update pattern adherence data - 2026-07-06 by @Amy-Leadem in #6580
- Add platform-design-system-team label to workflows by @Tricia-Baker in #6577
- 📊 Update metrics dashboard data - 2026-07-10 by @Amy-Leadem in #6606
- 📊 Update pattern adherence data - 2026-07-13 by @Amy-Leadem in #6610
- Adds alert to additional info pointing to va-details by @Jeana-Clark in #6633
- [Documentation] Fixes broken link by @Jeana-Clark in #6634
- Design Tokens - Updates design token docs by @Jeana-Clark in #6618
- Update token note. Don’t use vads-font-size-source-sans-normalized. by @JAMI-GIBBS in #6645
- Chore(deps): Bump brace-expansion from 1.1.13 to 1.1.16 by @dependabot[bot] in #6652
- Chore(deps): Bump @department-of-veterans-affairs/component-library from 56.8.0 to 56.9.0 in the va-design-system-libraries group by @dependabot[bot] in #6661
- Form watch PoC: OMB expiration poller + vets-api PDF template audit by @Dominic-Padula in #6647
- Form watch: Adds PDF revision watch and reorganizes Slack digests by @Dominic-Padula in #6666
- Token docs cleanup by @DANIEL-BRADY in #6663
- 📊 Update metrics dashboard data - 2026-07-17 by @Amy-Leadem in #6639
- 📊 Update pattern adherence data - 2026-07-20 by @Amy-Leadem in #6644
- file-input: adds ADR for field label by @Kerry-Powell in #6662
- Chore(deps): Bump json from 2.19.2 to 2.19.9 in the bundler group across 1 directory by @dependabot[bot] in #6693
- Chore(deps-dev): Bump tar from 7.5.16 to 7.5.21 by @dependabot[bot] in #6695
- Design token migration: metrics + page by @Robert-Hasselle in #6646
- 📊 Update metrics dashboard data - 2026-07-24 by @Amy-Leadem in #6696
- Updates EDR template, adds YML version by @Jeana-Clark in #6699
- Updates for Token migration page: include platform code, fix URL by @Robert-Hasselle in #6723
- Add owners to the design token migration page by @Robert-Hasselle in #6728
- Chore(deps): Bump brace-expansion from 1.1.16 to 1.1.18 by @dependabot[bot] in #6737
- 📊 Update metrics dashboard data - 2026-08-03 by @Amy-Leadem in #6735
New Contributors
- @Robert-Hasselle made their first contribution in #6646
Full Changelog: https://va.ghe.com/software/vets-design-system-documentation/compare/Sprint-3…Sprint-4
What’s Changed
New Features & Components 🎉
⚠️ These new components are in beta and should NOT be used in production ⚠️
- Create
va-action-listandva-action-list-itemby @Ryan-Munsch in #2285
Fixes
- Bump the npm_and_yarn group across 1 directory with 2 updates by @dependabot[bot] in #2288
- va-sidenav: Fix submenu double focus outline by @Kerry-Powell in #2309
- va-sidenav-submenu: remove height:100% by @Kerry-Powell in #2308
- [va-date] Make hint text accessible to screen readers by @Ashley-Terstriep in #2291
Full Changelog: https://va.ghe.com/software/component-library/compare/v56.13.0…v56.14.0
What’s Changed
New Features & Components 🎉
N/A
Fixes
- Bump nanoid from 3.3.15 to 3.3.18 in the npm_and_yarn group across 1 directory by @dependabot[bot] in #2261
- va-combo-box: descriptive dropdown toggle aria-label by @Ashley-Terstriep in #2279
- [Tokens] - Convert spacing tokens to use rem instead of px by @Kerry-Powell in #2289
- va-alert: fix issue with slim prop not being reset if headline slot dynamically added by @Kerry-Powell in #2276
- va-modal: add screen reader text to status icons by @Ashley-Terstriep in #2280
New Contributors
- @Ashley-Terstriep made their first contribution in #2279
Full Changelog: https://va.ghe.com/software/component-library/compare/v56.12.0…v56.13.0
What’s Changed
New Features & Components 🎉
- va-tag-status: update background, border, spacing, icon size, and font-size for all variations by @Kerry-Powell in #2260
Fixes
- va-tag-status: remove role attibute, add prop to conditionally render it by @Kerry-Powell in #2262
- va-accordion: add word-wrap to prevent horizontal scrolling in content by @Kerry-Powell in #2275
Full Changelog: https://va.ghe.com/software/component-library/compare/v56.11.0…v56.12.0
August 2026
Content style guide
Links
-
Revised consideration about putting links on their own line to add “generally”:
We generally put links on their own line to help make the page easier to scan and the intention of the link as clear as possible. Too many embedded links can be distracting or overwhelming to people with traumatic brain injuries or other cognitive impairments.
-
Added information on how to structure link text for links that go to a site outside of VA.gov:
If the link takes the reader outside of VA.gov, name the external website in the link text. Put the action first (“Learn more about vaccines”) then the destination (“on the CDC website”) to lead with the value to the Veteran. We prefer to include the location in the main link text instead of in parentheses, like “Learn more about vaccines on the CDC website” and not “Learn more about vaccines (CDC website).”
Use a link label that tells the reader where the link takes them. We prefer including the location in the main link text instead of in parentheses since it’s clearer for screen readers and translated text. For example, “Play the YouTube video on creating an account” and not “Play the video on creating an account (YouTube).” But it’s okay to use parentheses if needed because of space constraints or to make the link text clearer.
-
Replaced “abilities” with “ways of interacting with the information”:
Avoid using words that assume certain ways of interacting with the information, like “See,” “Hear,” and “Watch.”
-
Updated guidance on links opening in a new tab to align with previous guidance. Links should only open in a new tab if the person will lose progress or unsaved data, regardless of the link’s destination:
Note: Links should open in the same tab, unless they meet the specific criteria for opening in a new tab. If a link needs to open in a new tab, add “(opens in a new tab)” to notify the person. Don’t use the new window icon unless there are space constraints.
Review guidance on when to open links in a new tab in the Components section
-
Added information on anchor and jump links:
We sometimes use an anchor or jump link when we need to link to a section within a VA.gov page. Anchor or jump links can be helpful in certain cases, like when we want to direct someone to a specific section on a long page. But if the heading of the section we’re linking to ever changes, the anchor or jump link won’t work and will redirect to the top of the page. Use anchor and jump links with caution.
-
Added information on how to structure link text for online forms:
Link text for forms
- Links to the form Detail page follow this format: Get VA Form XX-XXXX to download.
- Links to the online tool should include a verb and the purpose of the form. For example: Apply for healthcare benefits.
Note: If it will make the purpose of the link clearer, include “online” in the link text (“Apply for healthcare benefits online”). But if including “online” will be too repetitive or if a form only has an online version (no PDF option), you don’t need to include “online.”
- Updated all mentions of “form’s About page” to “form Detail page”
- Made edits throughout to align with the style guide
Components
Link
-
Updated guidance on links opening in a new tab to align with previous guidance:
- Open all links in the same tab, with one exception. Only open links in a new tab if selecting the link would cause the person to lose progress or unsaved data. In all other cases, links should open in the same tab.
- Always notify the person when opening in a new tab. Add “(opens in a new tab)” text to the link and use the external link variation. Don’t use the new tab icon unless there are space constraints.
Note: The external link variation applies to links that open in a new tab, not links that take people to a site outside of VA.gov.
- Links to a non-VA.gov site must indicate where they go. Follow the methods detailed in linking to external sites.
- Links that open in a new tab must indicate that. By default, the link component’s external link variation will add “(opens in a new tab)” to the link text instead of using an icon. This follows Techniques for WCAG 2.0 advice on providing people with both a spoken and visual warning that this link opens in a new tab.
-
Made edits throughout to align with the style guide