[EuiColorPicker][A11y] Add accessible color swatch labels

[JasonStoltz]

Is your feature request related to a problem? Please describe.
Per bug elastic/kibana#210611 in Kibana:

Colors in squares doesn't have labels for them.

(because otherwise the person who doesn't distinguish between colors won't know what color he/she is selecting until pressing Enter on it and when in the Color field he/she will see the color code). Or color code in Color field is changing when user is navigating through colors which are in squares by pressing Tab key.

Users use the EuiColorPicker to select colors. The options available in the EuiColorPicker are presented as color swatches, with no other labels or contexts. Since people might see color differently or not at all, it makes it hard for users to reliably select colors correctly when choosing between color swatches.

While it is hard for users to select a color, it is not impossible. If users navigate through the color swatch options via keyboard, or select color swatch options, they will see the corresponding hex value below.

Describe the solution you'd like
@mgadewoll Proposed a solution here.

The solution here would be to add a tooltip to provide a visible label.

with human readable color name	with custom hex code

The proposal mentions potential paths for showing labels:

• Raw hex values - I believe showing raw hex values in a label is the minimum that we would need to do here.
• Human readable color name - This will not always be possible, but if and when it is possible, it may be ideal. Though I think we'd need to validate that this is ideal or not.

Describe alternatives you've considered
N/A

Desired timeline
TBD

Additional context

[mgadewoll]

As mentioned in this issue: We should also look into potentially adding labels for the EuiHue and EuiSaturation thumbs as they select the color as well but don't visually indicate what the color is (besides filling the input)

I'd suggest checking the behavior here first and seeing if it's necessary.