The color difference of Text widget placeholder is too subtle on some browsers

[chenxinyanc]

Description

This is the screenshot of Jupyter Notebook 6.4.8 running on Python 3.10, opened on Chromium Edge:

The color difference of the placeholder "Type something" and the real text value "Type something" is too subtle and sometimes difficult to tell.

Text box text color: rgba(0, 0, 0, 0.8) (set by Jupyter) (This is rgb(51, 51, 51) on white background) Text box placeholder color: rgb(117, 117, 117) (set by Chrome / Edge browser)

The contrast ratio is 2.74.

While there seems to be no explicit rules on the expected contrast between text and placeholder colors, a contrast ratio that is too low means user may have difficulty distinguishing the two types of text.

Reproduce

import ipywidgets as widgets
from IPython.display import display

display(widgets.Text(
    value='Type something',
    description='String:'
))
display(widgets.Text(
    placeholder='Type something',
    description='String:'
))

Expected behavior

I think the normal text box text color should be darker to make the state difference more obvious.

If I override the text box text color to rgb(0, 0, 0) (like the third one in the screenshot), the difference will be much easier to tell

Context

• ipywidgets version 7.6.5
• Operating System and version: Windows 11
• Browser and version: Edge 100.0.1169.1.

Troubleshoot Output

sys.executable:
        C:\Program Files\Python310\python.exe
sys.version:
3.10.2 (tags/v3.10.2:a58ebcc, Jan 17 2022, 14:12:15) [MSC v.1929 64 bit (AMD64)]
platform.platform():
Windows-10-10.0.22563-SP0
where jupyter:
C:\Program Files\Python310\Scripts\jupyter.exe
C:\Program Files\Python37\Scripts\jupyter.exe
pip list:
Package              Version
-------------------- -------
argon2-cffi          21.3.0
argon2-cffi-bindings 21.2.0
asttokens            2.0.5
attrs                21.4.0
backcall             0.2.0
black                22.1.0
bleach               4.1.0
cffi                 1.15.0
click                8.0.3
colorama             0.4.4
cycler               0.11.0
debugpy              1.5.1
decorator            5.1.1
defusedxml           0.7.1
entrypoints          0.4
executing            0.8.2
fonttools            4.29.1
ipykernel            6.9.0
ipython              8.0.1
ipython-genutils     0.2.0
ipywidgets           7.6.5
jedi                 0.18.1
Jinja2               3.0.3
jsonschema           4.4.0
jupyter              1.0.0
jupyter-client       7.1.2
jupyter-console      6.4.0
jupyter-core         4.9.1
jupyterlab-pygments  0.1.2
jupyterlab-widgets   1.0.2
kiwisolver           1.3.2
MarkupSafe           2.0.1
matplotlib           3.5.1
matplotlib-inline    0.1.3
mistune              0.8.4
mypy-extensions      0.4.3
nbclient             0.5.10
nbconvert            6.4.2
nbformat             5.1.3
nest-asyncio         1.5.4
notebook             6.4.8
numpy                1.22.2
packaging            21.3
pandas               1.4.1
pandocfilters        1.5.0
parso                0.8.3
pathspec             0.9.0
pickleshare          0.7.5
Pillow               9.0.1
pip                  22.0.3
platformdirs         2.5.0
prometheus-client    0.13.1
prompt-toolkit       3.0.28
pure-eval            0.2.2
pycparser            2.21
Pygments             2.11.2
pyparsing            3.0.7
pyrsistent           0.18.1
python-dateutil      2.8.2
pytz                 2021.3
pywin32              303
pywinpty             2.0.2
pyzmq                22.3.0
qtconsole            5.2.2
QtPy                 2.0.1
scipy                1.8.0
Send2Trash           1.8.0
setuptools           58.1.0
six                  1.16.0
stack-data           0.1.4
terminado            0.13.1
testpath             0.5.0
tomli                2.0.1
tornado              6.1
traitlets            5.1.1
wcwidth              0.2.5
webencodings         0.5.1
wheel                0.37.1
widgetsnbextension   3.5.2

Command Line Output

Paste the output from your command line running `jupyter lab` (or `jupyter notebook` if you use notebook) here, use `--debug` if possible.

Browser Output

Paste the output from your browser Javascript console here.

If using JupyterLab

• JupyterLab version:

Installed Labextensions

Paste the output from your command line running `jupyter labextension list`.

[vidartf]

You write that the default text color comes "from Jupyter", but it would be good if we knew some more about precisely where it is coming from. Is it coming from the notebook package? Is it coming from ipywidgets? If you run this on JupyterLab, does it have the same values? What about with other JupyterLab themes? Depending on the answer, this issue might be better off transferred to either the notebook, jupyterlab or general accessibility repo.