Invoke color picker with shortcut

[brettcannon]

Discussed in microsoft/vscode-python#15697

^{Originally posted by blaylockbk March 17, 2021}
VS code has a built-in color picker that is so handy for some languages but is not useable in a Python script.

Sometimes I have a variable or argument that represents a color RGB or Hex, and it would be wonderful if I could modify these with a color picker. It's probably not possible for the extension to automatically know these are colors, but it would be nice if I could manually invoke the color picker with a short cut, as discussed here microsoft/vscode#52364, and then click the color to insert it.

Color variable as RGB

my_color = (.4, .5, .3)

Color argument as a Hex value

import matplotlib.pyplot as plt
plt.plot([1,2,3,4], color="#6666ff")
```</div>

[brettcannon]

Thanks for the feature request! We are going to give the community 60 days from when this issue was created to provide 5 👍 upvotes on the opening comment to gauge general interest in this idea. If there's enough upvotes then we will consider this feature request in our future planning. If there's unfortunately not enough upvotes then we will close this issue.

[blaylockbk]

I found a workaround using the json-color-token vscode extension.

See this for an example of how to invoke the color picker for hex colors in a python file
YECHUNAN/json-color-token#2

[brettcannon]

Thank you to everyone who upvoted this issue! Since the community showed interest in this feature request we will leave this issue open as something to consider implementing at some point in the future.

We do encourage people to continue 👍 this issue as it helps us prioritize our work based on what the community seems to want the most.

[x11x]

I know this issue is about a keyboard shortcut, I don't know if this kind of comment is helpful (apologies if not), but I wanted to suggest an alternative way this could work.

I don't know how feasible this is as it seems like it would need support in the language server, but it would be nice to be able to define an "RGB" class e.g. as a namedtuple or dataclass, and in the VSCode workspace configuration, specify that the name "RGB" refers to an RGB color, and have VSCode display the color picker and box next to it wherever it appears in source files. For example, it might be used something like RGB(1, 2, 3). If the arguments are not literals, it should not get the color picker and just be treated like regular code.

There might be some variation in the way such a class is defined (are the values floats in the interval [0.0, 1.0], are they ints in the interval [0, 255], or does it take a hex string as an argument, like RGB("#ABCDEF"), or a single int literal e.g. RGB(0xABCDEF)?). I think its possible to differentiate and support most of these cases though.

I also wanted to add -- something that is currently supported, does not require any extensions, and although does not solve the exact problem of RGB color literals in the source, gives a good editing experience if you don't mind defining your color values in a separate JSON file. I noticed that you can actually specify a JSONSchema using "$schema" and use the "color" format -- it will get the color picker and colored box next to it. Windows Terminal settings.json does this (and is a good reference for how to do this, see the schema). Again, needs no extensions, and gives a good editing experience if it is acceptable that the colors are defined in a separate JSON file. And its fairly trivial in many languages to load a JSON file and package arbitrary resources/assets with your code. You also need to host the schema somewhere I think (or possibly it can be a reference to a local file).

[debonte]

I have a prototype of this working. Needs some more work, specifically around formatting the color chosen in the color picker to match what the user is probably expecting. https://github.com/debonte/pyrx/tree/pylance6761

[debonte]

This issue has been fixed in prerelease version 2025.4.100, which we've just released. You can find the changelog here: CHANGELOG.md

Support of the editor's color picker is currently controlled by an experiment. If you want to opt in to the behavior, set python.analysis.enableColorPicker to true.