Find values that break your design tokens

Your design tokens are the colours, fonts and spacing a site is meant to use. Divi Steward reads them from Divi’s own global colours and variables, the same ones you edit on the Design Tokens tab, so the tab and the scanner always agree.

What counts as a violation

The violation scanner walks every Divi module on every page and checks five kinds of value:

• colours
• fonts
• font sizes
• spacing (margin and padding)
• border radius

A value that points to a token (a global colour or a global variable) always passes. So does a value typed in by hand that equals an approved token exactly, zero spacing or radius, and a fully rounded corner. Everything else is reported, grouped by value, with the number of places it is used.

Fixing what it finds

Colours. Pick the approved global colour to use instead and press Fix. Steward suggests the closest one when there is a close match. You see how many places will change before anything is saved, and a snapshot is taken first, so the change can be undone from the Snapshots tab.

Fonts, font sizes, spacing and border radius. These are not changed for you, because swapping 30px for 32px across a site moves layouts in ways you only see afterwards. Open the list of places and edit each one in the Visual Builder, where you can see the result.

Hand-typed values that already match a token. They pass the scan, but a later change to the token will not reach them. Link them turns each one into a reference to its token. Nothing on the page moves, and a snapshot is taken first.

Values you meant to use. Mark a value as intentional for a month, six months or for good, with a note, and it drops out of the results.

If one off-brand value is everywhere, the colour swapper or find and replace will change it on every page in one pass.

Deleting a token

Before you remove a token, Divi Steward counts how many pages still reference it. A token that is still in use is not safe to delete.