A stepped slider recently landed, allowing you to set padding in multiples of a base unit. There are a few followups to look at.

Fix artifact glitches 🚨

• Fix artifact glitches with knob

Occasionally (exact steps to reproduce are unclear) but there's occasionally a white artifact on top of the blue knob:

Update the design to remove the knob

• Move to a segment selection interface instead of the knob

Placing the handle at the end of the current value makes sense when we think of this as a traditional range, but it might be better for each step to act as a handle:

This makes it a bit more obvious that each step acts as an individual button for quicker jumping.

Increase density when unlinked

• Optimise and condense unlinked padding / margin controls #49264

The unlinked splits each value into a single row which occupies a lot of space in the context of other controls. We can remedy this by splitting the layout into two columns:

Nice to have: Unit multiplier in the padding visualization

• Show the unit multiplier in the padding visualization, top/right/bottom/left on the padding silhouette

Issue updated Nov 21.

Completed

Replace the labels with numbers

• Replace the small/medium/large labels numbers 0-7 (Spacing presets: switch to using numbers instead of t-shirt sizes for labels #44247)

The values 0-7 replace 0, 2x-small, x-small, small, medium, large, x-large, 2x-large

Update spacing and labels

• Update spacing in exploded padding control #44121 🚨 (Spacing presets: Modify the styling of the input controls when in unlinked mode in order to better differentiate sides #44141)
• Individual side labels should use the new all-caps label style 🚨 (also covered in Spacing presets: Modify the styling of the input controls when in unlinked mode in order to better differentiate sides #44141)