The Color Picker dialogue gives you a wide array of options to define the perfect colour for your map's features, labels and background.
This dialogue is divided into the following sections:
- HSB - Hue / Saturation / Brightness,
- CMYK - Cyan / Magenta / Yellow / Black,
- Theme Colors and Standard Colors,
- Color Picker,
Colour Gradient Box
Click and drag the white circle. The three different ways to represent a colour numerically (HSB, RGB and CMYK) will adjust automatically. You can also adjust specific aspects of the colour using the properties below the gradient box. Edit a value directly or use the radio buttons. To select the aspect to appear in the slider bar to the right of the colour gradient box.
HSB - Hue / Saturation / Brightness
Hue is a degree on the colour wheel from 0° to 360°: 0° is red, 120° is green, 240° is blue.
Saturation is a percentage value: 0% means a shade of gray and 100% is the full colour.
Brightness is a percentage value: 0% is black, 100% is white.
RGB - Red / Green / Blue
Each parameter defines the intensity of the respective colour as an integer between 0 and 255. Computer screens display colours using RGB colour values.
The RGB values can be represented as a single hexadecimal value. A value is specified using #RRGGBB with RR (red), GG (green) and BB (blue) hexadecimal values between 00 (lowest value) and FF (highest value).
CMYK - Cyan / Magenta / Yellow / Black
Each parameter defines the intensity of the respective colour as a percentage between 0 and 100. Printers often present colours using CMYK colour values.
Theme Colors and Standard Colors
Select one of the predefined Theme Colors or Standard Colors.
Custom Colour
Select one of your own Custom Colors. Select a colour box in the Custom Colors section, create a colour using the colour gradient box or the colour codes and click Add New to Custom Colors to save a colour you wish to reuse in the future.
Color Picker
Click and hold on to the eyedropper icon. Then move the mouse around your screen. The colour under the mouse appears in the top portion of the pop-up and a magnified view of where the mouse appears in the bottom portion.
Accessibility
About 8% of men and 0.5% of women are born with some form of colorblindness. Use the Accessibility options to assist in selecting colours.
Visual Disorder | Description | Population affected | Simulation | Normal vision |
Achromatopsia | Total colour blindness | Very rare | ||
Protanopia | Red blindness | 1% of men | ||
Deuteranopia | Green blindness | 1% of men | ||
Tritanopia | Blue blindness | Less than 1% of men and women | ||
Protanomaly | Red weakness |
1% of men, 0.01% of women |
||
Deuteranomaly | Green weakness |
6% of men, 0.4% of women |
||
Tritanomaly | Blue weakness | Less than 0.01% of men and women |
Colour Analysis
Use the Color Analysis statistics to obtain a colour respecting the Web Content Accessibility Guidelines (WCAG) 2.0 level AA.
- Contrast: Ratio between the foreground colour and background colour using the colour luminance values.
- Brightness Ratio: Color brightness is determined by the following formula:
((red value X 299) + (green value X 587) + (blue value X 114)) / 1000
Note: This algorithm is taken from a formula for converting RGB values to YIQ values. This brightness value gives a perceived brightness for a colour. The range for colour brightness difference is 125. - Brightness Difference: You get a brightness difference by subtracting the brightness value of the background from the brightness value of the text:
text brightness - background brightness = brightness difference
If the background is brighter than the text, for example, black text on white, then the brightness difference will, of course, be a negative number. With 10 pt text results that are outside of a range of -80 to 80 in the brightness difference are moderately readable. - Color Difference: Color difference is determined by the following formula:
(maximum (red value 1, red value 2) - minimum (red value 1, red value 2)) +
(maximum (green value 1, red value 2) - minimum (green value 1, red value 2)) +
(maximum (blue value 1, red value 2) - minimum (blue value 1, red value 2))
The range for color difference is 500. - WCAG 2 AA Compliant: The colour contrast ratio changes from 1:1 (no contrast, e.g., black text on a black background) to 21:1 (maximum contrast, e.g., black text on a white background). To be AA compliant, the ratio must be 4,5:1 or more.