The Color picker should display an HSV rectangle by default

[ItsTristan]

Describe the project you are working on

Small 2D and 3D multiplayer game prototypes.

Describe the problem or limitation you are having in your project

Many colour options in Godot default to white. This isn't inherently a problem, but this means that the colour picker is, by default, in a degenerate state:

You're shown a large white circle, a white-to-black slider, and cyan/magenta/yellow sliders at the bottom. It's not immediately apparent how you'd select, say, bright green. Instead, you either:

• have to work backwards, figuring out how much cyan, magenta and yellow to mix to get the right hue, or
• pick a perceived lightness value and work backwards until you get the right basic hue

The problem here is not the default choice of white, but how the colour picker behaves by default and how that interacts with white. Colours need to be the most selectable option on display. Instead, the user is left having to figure out how each slider will behave, often taking extra steps of tweaking to create "enemy highlight red" or "item glow orange" or "bright grassy green" or "nighttime blue". It's a small inconvenience, but when you're testing out lots of colours it gets to be a nuisance.

This is not helped by changing to the HSV tab, either. While you can select hue first, the main interaction space is still in a degenerate state, meaning you're stuck with a large white void in your main colour circle. (There also appears to be a bug that prevents the saturation slider from affecting the OKHSL circle, and a bug preventing the circle from displaying the same colours as the sliders)

Changing to the OKHSL tab (which is hidden in a pocket menu even though the main display is an OKHSL picker), you have the same issue again. Changing the hue or the saturation doesn't break this degenerate state, meaning the colour circle is still not usable:

The easiest way to break out of this is to either guess colours and settings until you get a usable interface, or click this tiny button in the corner and select a different colour picker.

The result is that the interface behaviour is backwards: the most prominent elements have the least control, while the least obvious elements have the most control.

Describe the feature / enhancement and how it helps to overcome the problem or limitation

The colour picker should display the HSV rectangle by default. The HSV rectangle gives better control over simple colouring when you just need to eyeball something, while leaving the RGB options available for fine-tuning and for programmers.

While it isn't perfect, it's easy to understand and generates less friction in most instances, serving as a middle ground between artist needs and programmer needs. There may be an argument about the merits of OKHSL over other colour spaces, but the default setting needs to be a more usable one since that's what new users will be interacting with.

Describe how your proposal will work, with code, pseudo-code, mock-ups, and/or diagrams

If this enhancement will not be used often, can it be worked around with a few lines of script?

In the editor settings, it's possible to change the default colour picker mode and colour picker shape:

Is there a reason why this should be core and not an add-on in the asset library?

This is about out-of-the-box usability.

[Calinou]

I agree it's pretty unexpected to see a white circle by default when opening a new ColorPicker, but I wonder if we can resolve this issue without changing the default color picker shape. I believe many apps use a circular shape by default, yet they don't have this issue where the shape appears fully white in new ColorPickers.

[ItsTristan]

I think the white circle is a flaw with specifying an HSL space with hue and saturation as the palette elements and lightness as the slider axis. This is fine in art and design programs where you're typically modifying the colour you were already working with, and want to keep colours within the same brightness range. But it's a little confusing here where picking a colour is disjointed from previous selections, and where white shows up as a default quite often.

Other apps also typically use hue as the slider axis to ensure as many colours are visible by default:

Krita


Clip Studio Paint

 

GIMP

(GIMP's default colour picker is a bit strange in that the sliders have void spaces)  

Asesprite


The OKHSL wheel is correct as far as I understand it, it just doesn't seem appropriate in this context.

https://github.com/behreajj/AsepriteOkHsl

wrong picture

 (image source: https://bottosson.github.io/posts/colorpicker/)