When few QuickPickItems are shown there is not enough contrast in dark mode

[timheuer]

Type: Bug

When a QuickPick menu is shown with a small amount of items (like a true/false or only two options), in dark theme, the second item feels more muted as the background (editor or other thing) isn't enough contrast against the item behind it. Compared to light mode where there is more edges in contrast.

This was reported by some user studies on our extension, missing seeing the second option.

VS Code version: Code - Insiders 1.96.0-insider (709e28f, 2024-11-27T08:45:28.012Z)
OS version: Windows_NT x64 10.0.26100
Modes:

System Info

Item	Value
CPUs	11th Gen Intel(R) Core(TM) i7-11370H @ 3.30GHz (8 x 3302)
GPU Status	2d_canvas: enabled canvas_oop_rasterization: enabled_on direct_rendering_display_compositor: disabled_off_ok gpu_compositing: enabled multiple_raster_threads: enabled_on opengl: enabled_on rasterization: enabled raw_draw: disabled_off_ok skia_graphite: disabled_off video_decode: enabled video_encode: enabled vulkan: disabled_off webgl: enabled webgl2: enabled webgpu: enabled webnn: disabled_off
Load (avg)	undefined
Memory (System)	31.84GB (6.15GB free)
Process Argv	--crash-reporter-id 5f5d2ab1-465c-4ddc-809d-58d91db5dfb0
Screen Reader	no
VM	0%

Extensions (96)

Extension	Author (truncated)	Version
better-comments	aar	3.0.2
tsl-problem-matcher	amo	0.6.2
open-in-github-button	ant	0.1.1
vscode-httpyac	anw	6.16.4
azurite	Azu	3.33.0
npm-intellisense	chr	1.4.5
path-intellisense	chr	2.9.0
esbuild-problem-matchers	con	0.0.3
vscode-markdownlint	Dav	0.57.0
vscode-eslint	dba	3.0.10
npm-browser	den	1.1.4
gitlens	eam	2024.11.2704
vsc-material-theme-icons	equ	3.8.10
azure-storage-explorer	for	0.1.2
visual-nuget	ful	0.3.4
html-preview-vscode	geo	0.2.5
vscode-user-secret-management	gia	1.0.0
codespaces	Git	1.17.3
copilot	Git	1.246.1230
copilot-chat	Git	0.23.2024112701
remotehub	Git	0.64.0
vscode-github-actions	git	0.27.0
vscode-pull-request-github	Git	0.100.3
rest-client	hum	0.25.1
svg	joc	1.5.4
rainbow-csv	mec	3.13.0
render-crlf	med	1.8.5
fluent-icons	mig	0.0.19
dotenv	mik	1.0.1
lipsum-generator	MrA	1.2.3
language-gettext	mro	0.5.0
azure-pipelines	ms-	1.247.2
azure-dev	ms-	0.8.4
vscode-apimanagement	ms-	1.0.8
vscode-azure-github-copilot	ms-	0.3.42
vscode-azureappservice	ms-	0.25.4
vscode-azurecontainerapps	ms-	0.7.1
vscode-azurefunctions	ms-	1.16.1
vscode-azureresourcegroups	ms-	0.9.9
vscode-azurestaticwebapps	ms-	0.12.2
vscode-azurestorage	ms-	0.16.1
vscode-azurevirtualmachines	ms-	0.6.6
vscode-bicep	ms-	0.31.92
vscode-cosmosdb	ms-	0.24.0
vscode-docker	ms-	1.29.3
csdevkit	ms-	1.14.12
csharp	ms-	2.58.20
dotnet-interactive-vscode	ms-	1.0.5575041
vscode-dotnet-pack	ms-	1.0.13
vscode-dotnet-runtime	ms-	2.2.3
vscode-dotnet-sdk	ms-	0.8.0
vscode-aks-tools	ms-	1.5.2
vscode-kubernetes-tools	ms-	1.3.18
playwright	ms-	1.1.12
debugpy	ms-	2024.12.0
python	ms-	2024.20.0
jupyter	ms-	2024.10.0
remote-containers	ms-	0.391.0
remote-ssh	ms-	0.116.2024112515
remote-ssh-edit	ms-	0.87.0
remote-wsl	ms-	0.88.5
vscode-remote-extensionpack	ms-	0.26.0
azure-account	ms-	0.12.0
azure-repos	ms-	0.40.0
azurecli	ms-	0.6.0
cpptools	ms-	1.23.1
live-server	ms-	0.4.15
makefile-tools	ms-	0.12.10
powershell	ms-	2024.4.0
remote-explorer	ms-	0.5.2024111900
remote-repositories	ms-	0.42.0
remote-server	ms-	1.6.2024112109
vscode-speech	ms-	0.12.1
windows-ai-studio	ms-	0.6.1
azurerm-vscode-tools	msa	0.15.13
uuid-generator	net	0.0.5
vsix-viewer	onl	1.0.5
vscode-jest	Ort	6.4.0
vscode-versionlens	pfl	1.14.5
material-icon-theme	PKi	5.14.1
postman-for-vscode	Pos	1.5.0
quicktype	qui	23.0.170
sqlite-viewer	qwt	0.9.5
vscode-thunder-client	ran	2.32.2
vscode-yaml	red	1.15.0
vscode-marketplace-preview	rob	1.5.1
svg-preview	Sim	2.8.3
aspire-gen	Tim	0.3.0
dotnet-containerizer	Tim	0.1.2
mympclient	tim	0.1.6
resx-editor	tim	0.2.21
es6-string-html	Tob	2.16.0
typespec-vscode	typ	0.62.0
application-insights	Vis	0.4.2
vscode-icons	vsc	12.9.0
volar	Vue	2.1.10

(1 theme extensions excluded)

A/B Experiments

vsliv368cf:30146710
vspor879:30202332
vspor708:30202333
vspor363:30204092
vscod805cf:30301675
vsaa593:30376534
py29gd2263:31024238
vscaac:30438845
c4g48928:30535728
2i9eh265:30646982
962ge761:30841072
pythonnoceb:30776497
asynctok:30898717
dsvsc014:30777825
dsvsc015:30821418
pythonmypyd1:30859725
h48ei257:31000450
pythontbext0:30879054
cppperfnew:30980852
pythonait:30973460
da93g388:31013173
dvdeprecation:31040973
dwnewjupyter:31046869
nativerepl1:31134653
pythonrstrctxt:31093868
nativeloc1:31118317
cf971741:31144450
e80f6927:31120813
iacca1:31150324
notype1:31143044
dwcopilot:31158714
h409b430:31177054
390bf810:31183120
5b1c1929:31184661

[isidorn]

The issue might be that the quick pick shadow is more visible on the light theme, compared to the dark theme.

[TylerLeonhardt]

What theme are you using?

[TylerLeonhardt]

It looks like Dark Modern... which does have a darker Quick Pick and well darker everything. Maybe we go a touch lighter on the quick pick.

@isidorn this is probably a good one for the future @daviddossett.

[timheuer]

@TylerLeonhardt my light theme is a custom one, but the dark one is 'Default Dark Modern'