From 8e2a6f76c717b93fce0f7fd916eee37e5aa706b7 Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 18:35:06 -0500 Subject: [PATCH 1/9] High contrast focus style on adminbar front-end search. --- src/wp-includes/css/admin-bar.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/wp-includes/css/admin-bar.css b/src/wp-includes/css/admin-bar.css index 6958234ac739a..c471b43cfa352 100644 --- a/src/wp-includes/css/admin-bar.css +++ b/src/wp-includes/css/admin-bar.css @@ -705,6 +705,8 @@ html:lang(he-il) .rtl #wpadminbar * { background-color: rgba(255, 255, 255, 0.9); cursor: text; border: 0; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #wpadminbar #adminbarsearch .adminbar-button { From d33a7fd7015fa7bae006c0b65a13aa1810626c54 Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 18:56:40 -0500 Subject: [PATCH 2/9] Add WHCM focus outline on focused select --- src/wp-admin/css/forms.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/wp-admin/css/forms.css b/src/wp-admin/css/forms.css index 2ace16f733004..43e50099a25f0 100644 --- a/src/wp-admin/css/forms.css +++ b/src/wp-admin/css/forms.css @@ -359,6 +359,8 @@ input[type="radio"].disabled:checked::before { border-color: var(--wp-admin-theme-color); color: #1e1e1e; box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wp-core-ui select:active { From 2ee7813549cb228e19d403d123d79578133bf97a Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 19:12:32 -0500 Subject: [PATCH 3/9] Change button high contrast outline to 2px --- src/wp-admin/css/colors/_mixins.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/wp-admin/css/colors/_mixins.scss b/src/wp-admin/css/colors/_mixins.scss index 7b3802307a637..49ed69c3b0bdc 100644 --- a/src/wp-admin/css/colors/_mixins.scss +++ b/src/wp-admin/css/colors/_mixins.scss @@ -74,7 +74,7 @@ border-color: var(--wp-admin-theme-color); color: var(--wp-admin-theme-color); box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color); - outline: 1px solid transparent; + outline: 2px solid transparent; } &:active { From 50c1e670cd59405d152164bba980326b31140218 Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 19:13:03 -0500 Subject: [PATCH 4/9] All butttons... --- src/wp-admin/css/colors/_mixins.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/wp-admin/css/colors/_mixins.scss b/src/wp-admin/css/colors/_mixins.scss index 49ed69c3b0bdc..f3024e66f9b03 100644 --- a/src/wp-admin/css/colors/_mixins.scss +++ b/src/wp-admin/css/colors/_mixins.scss @@ -26,7 +26,7 @@ 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color), inset 0 0 0 1px tokens.$white; /* Visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } &:active { @@ -113,7 +113,7 @@ border-color: var(--wp-admin-theme-color); color: tokens.$gray-900; box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color); - outline: 1px solid transparent; + outline: 2px solid transparent; } &:active { From 769fecc3f34c7e09e031bbe9f35591fadeb27a9b Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 19:16:07 -0500 Subject: [PATCH 5/9] Add high contrast visibility in theme browser --- src/wp-admin/css/themes.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/wp-admin/css/themes.css b/src/wp-admin/css/themes.css index 5b71c223b6ce6..1e7aaed5d3047 100644 --- a/src/wp-admin/css/themes.css +++ b/src/wp-admin/css/themes.css @@ -486,7 +486,8 @@ body.js .theme-browser.search-loading { .theme-overlay .theme-header .right:focus, .theme-overlay .theme-header .left:focus { box-shadow: none; - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .theme-overlay .theme-header .left.disabled, From 2bde0cd1819ba8fb94dc04a54e88f5371dadbbba Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 19:18:53 -0500 Subject: [PATCH 6/9] Plugin information tabs focus WHCM --- src/wp-admin/css/common.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css index 69bd0b2eb0378..978f1d6fe5208 100644 --- a/src/wp-admin/css/common.css +++ b/src/wp-admin/css/common.css @@ -2934,7 +2934,8 @@ div.action-links { #plugin-information-tabs a:active, #plugin-information-tabs a:focus { - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #plugin-information-content { From 8676d5abc6e54a9ad6e0c7d958ababef9c842347 Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Fri, 2 Oct 2026 20:04:25 -0500 Subject: [PATCH 7/9] Missing comments. --- src/wp-admin/css/colors/_mixins.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/wp-admin/css/colors/_mixins.scss b/src/wp-admin/css/colors/_mixins.scss index f3024e66f9b03..ea430284eac8d 100644 --- a/src/wp-admin/css/colors/_mixins.scss +++ b/src/wp-admin/css/colors/_mixins.scss @@ -74,6 +74,7 @@ border-color: var(--wp-admin-theme-color); color: var(--wp-admin-theme-color); box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color); + /* Visible in Windows High Contrast mode */ outline: 2px solid transparent; } @@ -113,6 +114,7 @@ border-color: var(--wp-admin-theme-color); color: tokens.$gray-900; box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color); + /* Visible in Windows High Contrast mode */ outline: 2px solid transparent; } From f150e26da6b5add6b2cb29e93480c816a6e7a84d Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Sun, 4 Oct 2026 17:55:35 -0500 Subject: [PATCH 8/9] Remove the obsolete -moz-focusring override This override has been mapped to be equivalent to `:focus-visible`, which also changes how it operates, modifying the text color rather than ring color. This causes any support to result in transparent text in high contrast mode --- src/wp-admin/css/forms.css | 7 ------- 1 file changed, 7 deletions(-) diff --git a/src/wp-admin/css/forms.css b/src/wp-admin/css/forms.css index 43e50099a25f0..e92fa571eddac 100644 --- a/src/wp-admin/css/forms.css +++ b/src/wp-admin/css/forms.css @@ -385,13 +385,6 @@ input[type="radio"].disabled:checked::before { cursor: default; } -/* Reset Firefox inner outline that appears on :focus. */ -/* This ruleset overrides the color change on :focus thus needs to be after select:focus. */ -.wp-core-ui select:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #0a4b78; -} - /* Remove background focus style from IE11 while keeping focus style available on option elements. */ .wp-core-ui select::-ms-value { background: transparent; From c44f3d60ea0dce56b9a2f24f1ceda81251f17aa6 Mon Sep 17 00:00:00 2001 From: Joe Dolson Date: Mon, 5 Oct 2026 13:20:14 -0500 Subject: [PATCH 9/9] Set select arrow to white when forced colors active & preferred color scheme is dark --- src/wp-admin/css/forms.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/wp-admin/css/forms.css b/src/wp-admin/css/forms.css index e92fa571eddac..90d8cf6e63cab 100644 --- a/src/wp-admin/css/forms.css +++ b/src/wp-admin/css/forms.css @@ -381,6 +381,12 @@ input[type="radio"].disabled:checked::before { transform: none; } +@media all and (forced-colors: active) and (prefers-color-scheme: dark) { + .wp-core-ui select { + background-image: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E); + } +} + .wp-core-ui select[aria-disabled="true"] { cursor: default; }