Classic block: Icons of the TinyMCE buttons are barely visible in the buttons active state

[afercia]

This appears to be a regression in WordPress 7.0. The issue does not occur in WordPress 6.9.

To reproduce:

• Create a post and add a Classic block.
• In the Classic block, add some text.
• Select the text and make it bold.
• Observe the icon of the Bold button becomes white, on a light gray background.
• Repeat with other buttons that keep an 'active' state.

See attached screenshots.

My guess is that the icon change comes from some TinyMce update to their own 'skin' css, which isn't under WordPress's control as fare as I can tell.

One option could be to try to change the background instead, and make it dark grey. ​The background is controlled in one of the WordPress's stylesheets but such a change should be tested extensively.

See attached screenshots.

[afercia]

Icons not visible in WP 7.0.

[afercia]

Icons visible in WP 6.9.

TinyMCE's lightgray skin styles active toolbar buttons as white icons on a dark background. editor.css overrides both halves — the background becomes light gray and the icon colour reverts to inherit — but the colour override used the same selectors as the skin, so it only won the cascade when parsed later.

What the problem was:

• TinyMCE appends its skin stylesheet when the editor initializes. When the editor is initialized after page load, as the Classic block does, the skin is parsed after editor.css and its white icon colour wins the tie.
• The classic editor is unaffected because wp_editor() prints editor-buttons inline in the body, after the skin.
• Result: active buttons render a white icon on the #f0f0f1 background — 1.1:1 contrast.

What the fix does:

• Adds the mce-widget class, which TinyMCE puts on every button alongside mce-btn, to the five existing override selectors.

Approach and why:

• The override already expresses the correct intent; it just needed to stop depending on source order. Adding a class TinyMCE always emits raises specificity above the skin without narrowing scope.
• Scoping to .mce-toolbar .mce-btn-group would also have worked but would drop menubar buttons, which plugins can enable via tiny_mce_before_init.

Trac ticket: https://core.trac.wordpress.org/ticket/65768

## Use of AI Tools

AI assistance: Yes
Tool(s): Claude Code
Model(s): Claude Opus 5
Used for: Ticket analysis, tests and writing PR. All changes were reviewed and validated by me.

[iqbal1hossain]

​https://github.com/WordPress/wordpress-develop/pull/12783

Tested the patch and confirmed it resolves the reported issue. I was able to reproduce the problem before applying the PR and verified that it no longer occurs afterward.

​https://prnt.sc/96gceFFwRpdk

[gulamdastgir04]

Test Report

Patch tested: ​https://github.com/WordPress/wordpress-develop/pull/12783

Environment

• WordPress: 7.1-beta4-20260731.041039
• Subdirectory: No
• PHP: 7.4.33
• Server: PHP.wasm
• Database: WP_MySQL_On_SQLite (Server: 8.0.38 / Client: 3.51.0)
• Browser: Chrome 150.0.0.0
• OS: Linux
• Theme: Twenty Twenty-Five 1.5
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.3.0

1. ✅ Patch is solving the problem

[darshitrajyaguru97]

`

Test Report

• Patch tested: ​https://github.com/WordPress/wordpress-develop/pull/12783

Environment

• WordPress: 7.1-beta4-20260731.041039
• PHP: 7.4.33
• Server: PHP.wasm
• Browser: Chrome
• OS: Windows 11
• Theme: Twenty Twenty-Five
• MU Plugins: None
• Active Plugins:
  • Test Reports 1.3.0

Results

The patch was tested in the above environment and performed as expected.

✅ Patch tested successfully. The reported issue is resolved, and no additional issues were observed during testing.
`

[afercia]

In 63532:

Editor: Fix color of the TinyMCE button icons in the Classic block.

Fixes a CSS specificity conflict with the TinyMCE skin where the button icons were white and barely visible in the buttons active state.

Developed in ​https://github.com/WordPress/wordpress-develop/pull/12783

Props khokansardar, iqbal1hossain, gulamdastgir04, darshitrajyaguru97, afercia.
Fixes #65768.