Are we Design Tokens yet?

The goal of this site is to help us track the propagation of design tokens in our tree. It works by gathering CSS files based on provided paths and then looks for CSS properties that would typically be expected to be tied to a design-token.

Values that aren't likely to be set to design tokens are explicitly ignored.

Current Limitations

• The paths this tool looks at are fully customizable and may need to be updated.
• The list of design token properties needs validating
• We could likely improve how values for shorthand properties are matched
• This tool does not currently work back variables that are assigned to design tokens, though this could likely be added later.

Paths

Average Propagation: 67.15%

• browser/components/aboutlogins/content 39.22%
• browser/components/aboutlogins/content/components 36.01%
• browser/components/aboutlogins/content/components/input-field 50%
• browser/components/aboutwelcome/content 38.76%
• browser/components/asrouter/content/components/ASRouterAdmin 32.56%
• browser/components/asrouter/content/components/fxa-menu-message 76.47%
• browser/components/backup/content 81.66%
• browser/components/contextualidentity/content 55.56%
• browser/components/downloads/content 83.34%
• browser/components/enterprisepolicies/content 23.81%
• browser/components/extensions 3.8%
• browser/components/firefoxview 40.12%
• browser/components/genai 78.18%
• browser/components/genai/content 64.71%
• browser/components/messagepreview 66.67%
• browser/components/places/content 100%
• browser/components/places/metadataViewer 27.27%
• browser/components/pocket/content/panels/css 17.54%
• browser/components/preferences/dialogs 46.43%
• browser/components/preferences/widgets/setting-group 100%
• browser/components/privatebrowsing/content 100%
• browser/components/profiles/content 78.98%
• browser/components/protections/content 18.03%
• browser/components/screenshots 43.75%
• browser/components/screenshots/overlay 20%
• browser/components/search/content 21.25%
• browser/components/shopping/content 47.89%
• browser/components/sidebar 74.76%
• browser/components/tabunloader/content 33.33%
• browser/components/textrecognition 33.33%
• browser/extensions/newtab/css 55.38%
• toolkit/content/widgets 78.05%
• toolkit/content/widgets/moz-box-button 100%
• toolkit/content/widgets/moz-box-group 100%
• toolkit/content/widgets/moz-box-item 66.67%
• toolkit/content/widgets/moz-box-link 100%
• toolkit/content/widgets/moz-button 94.37%
• toolkit/content/widgets/moz-button-group 100%
• toolkit/content/widgets/moz-card 96.97%
• toolkit/content/widgets/moz-fieldset 100%
• toolkit/content/widgets/moz-five-star 100%
• toolkit/content/widgets/moz-input-color 100%
• toolkit/content/widgets/moz-input-folder 100%
• toolkit/content/widgets/moz-input-text 100%
• toolkit/content/widgets/moz-label 100%
• toolkit/content/widgets/moz-message-bar 95.24%
• toolkit/content/widgets/moz-page-nav 77.5%
• toolkit/content/widgets/moz-select 100%
• toolkit/content/widgets/moz-toggle 90.91%
• toolkit/content/widgets/panel-list 69.02%