Make WordPress Core

Opened 3 days ago

Last modified 42 hours ago

#65444 new defect (bug)

Align admin CSS border-radius values with design system tokens

Reported by: dervishov's profile dervishov Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version:
Component: Administration Keywords: has-patch
Focuses: css Cc:

Description (last modified by sabernhardt)

Several admin CSS files use legacy border-radius values (3px, 5px, 9px, 10px, 11px) that don't match the design system scale defined in _tokens.scss (1px, 2px, 4px, 8px, 12px, 9999px).

This creates subtle visual inconsistency across the admin interface. For example, the customizer save button uses 3px while standard buttons use 2px, and admin menu notification badges use 9px while dashboard widgets use 8px.

The fix aligns all non-standard values to their nearest design token:

  • 3px → 2px (radius-s) — 10 locations
  • 5px → 4px (radius-m) — 3 locations
  • 9px → 8px (radius-l) — 1 location
  • 10px → 8px (radius-l) — 1 location
  • 11px → 12px (radius-30) — 1 location

7 files, 16 replacements. Differences are 1px, barely perceptible but bring the admin in line with the design system.

GitHub PR: https://github.com/WordPress/wordpress-develop/pull/12139

Change History (3)

#1 @sabernhardt
3 days ago

  • Description modified (diff)
  • Focuses css added
  • Version changed from trunk to 7.0

#2 @jorbin
2 days ago

  • Version 7.0 deleted

I spot checked the first three suggested changes and none were introduced in the last 5 years, so removing 7.0 from the version.

#3 @tusharaddweb
42 hours ago

Design system cleanup looks solid. The border-radius alignments consistently map legacy values to the nearest token — 3px → 2px, 5px → 4px, 9px/10px → 8px, 11px → 12px.

The 1px differences are imperceptible but bring visual consistency across the admin.

Patch is Looks good.

Note: See TracTickets for help on using tickets.