DevTools: U.S. Web Design System (USWDS)

View which USWDS components are being used on a page and the active responsive breakpoints.

What is DevTools: U.S. Web Design System (USWDS)?

DevTools: U.S. Web Design System (USWDS) is a Chrome extension that allows developers and designers to easily identify and access the U.S. Web Design System components used on a page. It also displays the active responsive breakpoints, aiding in the creation of responsive designs using utility classes. Contribute to this open-source extension on GitHub.

Download

Extension stats

By: sawyerh

View on Chrome Web Store

Users: 53 ▲ 7

Version: 1.0.1 (Last updated: 2023-08-16)

Creation date: 2023-08-16

Risk impact: Very low risk impact

Risk likelihood: Very low risk likelihood

Manifest version: 3

Permissions:

activeTab
scripting

Size: 975.87K

Email: br*****@sawyerh.com

Ranking

# 85513 ▲ 2754

Other rankings

#2406 in Developer Tools ▲ 21 #42 in system keyword 16 ▼ 3 #80 in design keyword 19 ▼ 1 #138 in component keyword 11 ▼ 4

Other platforms

Not available on Firefox

Not available on Edge

Want to check extension ranking and stats more quickly for other Chrome extensions? Install Chrome-Stats extension to view Chrome-Stats data as you browse the Chrome Web Store.

Extension summary

Analyze keywords

A simple extension that helps developers and designers learn what U.S. Web Design System components are in active use on a page. From the tags it layers onto the page, users can click a tag to quickly access the component's official USWDS documentation.

The active breakpoints are also displayed in the page's corner, helping developers pick which breakpoint prefix to use when building a responsive design using utility classes.

Contribute to this extension, it's open source: https://github.com/sawyerh/uswds-dev-tools