Sample color Information Box | |
---|---|
![]() | |
Hex triplet | #FFA500 |
sRGBB (r,g,b) | (255, 165, 0) |
HSV (h,s,v) | (39°, 100%, 100%) |
CIELChuv (L,C,h) | (75, 105, 45°) |
Source | Sample source |
B: Normalized to [0–255] (byte) H: Normalized to [0–100] (hundred) |
Wikipedia uses a standardized set of colorcoordinate systems incolor infobox (sample shown) and also in articles such asList of colors. Color coordinate ranges are a matter of choice and there is no universal standard range for manycolor spaces (though some ranges may be prevalent). A box having all of the different possible coordinate ranges would be impractical. Therefore, Wikipedia has chosen standard ranges for the coordinate systems, so as to have consistent coordinates in all color articles. This article describes the chosen systems and provides instructions for conversion to other ranges which might be needed by particular color environments.
sRGB has been the standard version of RGB for the web since 1996. As an RGB system, it describes the amounts ofred,green, andbluelight which areadded together in order to create a particular color. Every color infobox on Wikipediamust have one such parameter to, at the very least, show on the screen an idea of what the color looks like.
In the infobox, the coordinates are presented as three numbers separated by commas, as in this example for the color orange:
The coordinates within the parenthesis provide, in order, the relative values of red, green, and blue light. The number in each position ranges from 0 (no color added) to 255 (100% color added). This range was chosen because it is the most commonly used in computer color selection dialogs. (The numbers 0 through 255 fit naturally within onebyte and are therefore used to directly drivegraphics cards.)
Most image editing programs accept this range. Therefore, RGB should be entered into image editing programs wherever possible because it rarely (if ever) requires conversion.
It is assumed that the exact meaning of the primary colors ("red" for example) is that of thesRGB standard, and that the sRGBgamma function is in use. This color space isnot linear. Middle-grey sRGB values (with „middle“ defined as „emitting half as much visible light per area as a maximum brightness white“ and „grey“ defined as „having the same chromacity as thestandard illuminant D65“) are near 188,188,188, assuming the γ (gamma) correction formula from the sRGB standard is in use.
This is a compact representation of sRGB, usinghexadecimal numbering. The hex triplet is based upon the standard format for representing colors withinHTML, which is used to constructwebpages. This coordinate system should not require any conversion; it should be able to be used directly in HTML source as, for example, in thisstyle attribute:
Created to describe a typical 1990s CRT screen, sRGB has a limitedgamut and is unable to describe every real color. As Wikipedia templates take a hex triplet as input, all colors must have a value in the sRGB range. Fitting a color into the range is known asgamut mapping. The current practice is to use anscRGB interpretation scaled to 0-255.
CIELChuv is a perceptually uniform color space consisting oflightness,chroma andhue coordinates. It is derived from theCIELUV space, usually based on the 2° observer and the standardIlluminant D65 representing daylight.
huv is an angle that is normally given indegrees.L* is in the range0 to +100.C*uv describes the colorfulness and can range from 0 to a couple hundreds.
Colors out of the sRGB gamutshould specify a CIELChuv value. A CIELChuv value is enough to describeany color possible under daylight. Sources may specify colors in some otheruniform color space, which can be converted to CIELChuv using established algorithms such as those provided by thepython package "colour".
The CMYK coordinates describe the amounts of each ofcyan,magenta,yellow and key (black)pigments (such asinks) which are mixedsubtractively in order to create a particular color. In Wikipedia, the coordinates are presented as four numbers separated by commas, as in this example for the color orange:
The coordinates within the parenthesis provide, from left-to-right, the relative values of cyan, magenta, yellow, and key. The number in each position ranges from 0 (no pigment used) to 100 (maximum = 100% pigment coverage).
However, the ranges shown for Wikipedia do not correspond to the range normally used as the mathematic basis for computing CMYK, and may not correspond to those accepted by any given color selection dialog. (Probably few, if any, color selection dialogs provide direct access to this coordinate group, due to the reason below.)
CMYK isnot recommended in new articles except for colors only meaningful in CMYK (e.g.rich black). There are simply too many versions of CMYK around, with differences between inks (what does "cyan" look like?), paper (how muchdot gain, what color paper), machine, plus flexibilities in color blending. CMYK colors used in Wikipediamust come with a source and what kind of configuration the source is referring to.
Coordinate Group | Usage | Converting from Wikipedia coordinates |
---|---|---|
0–1.0, 0–1.0, 0–1.0, 0–1.0 |
| Divide each of the Wikipedia coordinates by 100. |
0–100, 0–100, 0–100, 0–100 |
| None needed. |
TheHSV color space coordinates describe a color in terms of thehue, given asdegrees, combined with asaturation and avalue, both represented aspercentages. (Value is similar tobrightness in this usage.) In Wikipedia, the HSV coordinates are represented as three numbers separated by commas and identified as either degrees or percentage, as in this example for the color orange:
The coordinates within the parentheses provide, from left-to-right, the relative values of hue, saturation, and value.
The first number, the hue, ranges from 0° to 359°. This defines the overall hue of the color.
The second number, the saturation (color intensity), ranges from 0% to 100%, with 100% indicating a very intense color and 0% indicatinggrey (that is, being completely neutral or without hue).
The third number, the value (or brightness), ranges from 0 to 100%, with 0% indicating black and 100% indicating the brightest possible intensity of a color, whether white or otherwise, as limited by a maximum inRGB color space. InHSL color space, on the other hand, only white can have a lightness of 100%.
See alsoHSL and HSV § Disadvantages.
This coordinate system is problematic, because programs that accept this system use several different ranges of numbers on input. Some of these are listed in the table below.
Coordinate Group | Usage | Converting from Wikipedia coordinates |
---|---|---|
0°–360°, 0–1.0, 0–1.0 |
| Strictly speaking, this conforms to the Wikipedia range, since 100% = 1.0. Divide saturation and value coordinates each by 100. |
0°–360°, 0%–100%, 0%–100% |
| None needed. |
0–255, 0–255, 0–255 |
| Multiply hue by; multiply saturation and value each by 2.55 |
0–1.0, 0–1.0, 0–1.0 |
| Divide hue by 360; divide saturation and value each by 100 |
Most image editing programs probably accept the RGB value, which should also be more easily used.
Many Microsoft Windows programs (such as Microsoft Paint) provide inputs to acceptHSL (hue, saturation, lightness) color coordinates in the range 0–240, 0–240, 0–240.[1] These values are only a computer workaround andshould never be used in the context of Wikipedia. Most (if not all) of these programs also accept RGB, which can typically be entered without conversion. Therefore, it is usually best in these programs to use the RGB coordinate.
If a source truly only provides a Microsoft HSL input and if you cannot find an alternate, convert it to sRGB. Firstmultiply hue by, anddivide lightness and saturation by 2.4 to obtain normal HSL values. Then use any online tool (such as[1]) to convert HSL to sRGB.