Change:
} registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) => { <del> const statusBarItemHoverBackground = theme.getColor(STATUS_BAR_ITEM_HOVER_BACKGROUND); if (statusBarItemHoverBackground) { collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:hover { background-color: ${statusBarItemHoverBackground}; }`); collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:focus { background-color: ${statusBarItemHoverBackground}; }`); } </del> <ins> if (theme.type !== HIGH_CONTRAST) { const statusBarItemHoverBackground = theme.getColor(STATUS_BAR_ITEM_HOVER_BACKGROUND); if (statusBarItemHoverBackground) { collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:hover { background-color: ${statusBarItemHoverBackground}; }`); collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:focus { background-color: ${statusBarItemHoverBackground}; }`); } </ins> <del> const statusBarItemActiveBackground = theme.getColor(STATUS_BAR_ITEM_ACTIVE_BACKGROUND); if (statusBarItemActiveBackground) { collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:active { background-color: ${statusBarItemActiveBackground}; }`); </del> <ins> const statusBarItemActiveBackground = theme.getColor(STATUS_BAR_ITEM_ACTIVE_BACKGROUND); if (statusBarItemActiveBackground) { collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:active { background-color: ${statusBarItemActiveBackground}; }`); } </ins> } <del> const contrastBorderColor = theme.getColor(contrastBorder); if (contrastBorderColor) { collector.addRule(`.monaco-workbench .part.statusbar > .items-container > .statusbar-item a:focus { outline: 1px solid ${contrastBorderColor};}`); </del> <ins> const activeContrastBorderColor = theme.getColor(activeContrastBorder); if (activeContrastBorderColor) { collector.addRule(` .monaco-workbench .part.statusbar > .items-container > .statusbar-item a:focus, .monaco-workbench .part.statusbar > .items-container > .statusbar-item a:active { outline: 1px solid ${activeContrastBorderColor} !important; outline-offset: -1px; } `); collector.addRule(` .monaco-workbench .part.statusbar > .items-container > .statusbar-item a:hover { outline: 1px dashed ${activeContrastBorderColor}; outline-offset: -1px; } `); </ins> } const statusBarProminentItemForeground = theme.getColor(STATUS_BAR_PROMINENT_ITEM_FOREGROUND);

Discussion:
<!-- Do Not Delete This! featurerequesttemplate --<!-- Please read our Rules of Conduct: --<!-- Please search existing issues to avoid creating duplicates. --To be consistent with the rest of the workbench we should consider: Use the orange borders for the active element instead of the blue one Remove the background color as I do not see it being used anywhere else for the active element
I agree this makes sense. We are open for a PR that fixes this. Code pointer Basically we should I think use a different color there and make sure it is also applied on the whole status bar. Adding help wanted and if nobody tackles this I can also look into it in the future
How is this different from ?
That one I used blue border for the focus items. Lad thinks it should be orange to make it clearer and consistent.
Yes agree, it should be this orange color we also have in tabs: !
Thanks to this is now fixed To verify, turn on High Contrast theme and: sure we use the orange border in the status bar both for the whole bar and for individual entries sure that hover feedback is a yellow doted line