[SOLVED] VS Code built-in color picker feature doesn't work in JSON files

VS Code built-in color picker feature doesn't work in JSON files

I have found info that VS Code has built-in color picker feature
But I can't figure out why it doesn't work for my JSON files.

For instance, this is my apple.json file:

{
    "apple": {
        "color": "#ff0000"
    }
}

So, color picker doesn't appear.

But - if I open VS Code's own settings.json file, and update it like so, for instance:

{
"workbench.colorCustomizations": {
    "activityBar.background": "#00AA00"
  }
}

color picker will instantly appear.

Why? How does a regular JSON file like "apple.json" differ from settings.json?

Solution

To have that work, you need a JSON schema associated with the json file. The schema has to say format: color on the property that represents a color. Only then a color decorator and picker is shown.

You can look here if you want to set up your own JSON schema: https://code.visualstudio.com/docs/languages/json#_json-schemas-and-settings