User:DePiep/rgb
Appearance
USER: /home- /subpg · /sbox- · /1 2 3 4 5 6 /help* /news /s- /x- /xx- /row- EXTERNAL: EL:w3c-css · TOOLS: WD: rgx101 PETSCAN · wtech /tpu · commons
WIKI: special:ExpandT Prefix (T:list) #parse {{MAGIC}} H:notes · _TOC_ WikiBlame mw:Lua man (patterns, debug, α) · T:SFW/s (M:,../sandbox) · M:String · TFA /better signpost adnws · SPEEDY CFSD · alerts
/unicode: {{T:U+}} m:Uchar · U+abbr · {{ISO15924}} ff conv · {{ISO4217}} BOXES: /chembox /ChemData · /drugbox T · TG · DEV: /CUR · /taxo · /chemlist · NBSP> < minus>−< NDASH>–< MDASH>—< NOT EQUAL>≠< DOTCIRCLE>◌<
ELEM: pv /elem · WT · ISO-T symbol-to-data · datarefs · :c:cat:PT · U:PTG · WP:PTG (t)
WIKI: special:ExpandT Prefix (T:list) #parse {{MAGIC}} H:notes · _TOC_ WikiBlame mw:Lua man (patterns, debug, α) · T:SFW/s (M:,../sandbox) · M:String · TFA /better signpost adnws · SPEEDY CFSD · alerts
/unicode: {{T:U+}} m:Uchar · U+abbr · {{ISO15924}} ff conv · {{ISO4217}} BOXES: /chembox /ChemData · /drugbox T · TG · DEV: /CUR · /taxo · /chemlist · NBSP> < minus>−< NDASH>–< MDASH>—< NOT EQUAL>≠< DOTCIRCLE>◌<
ELEM: pv /elem · WT · ISO-T symbol-to-data · datarefs · :c:cat:PT · U:PTG · WP:PTG (t)
This box: view ·
- User:DePiep/cc (edit · talk · history · links · /subpages · /doc · /doc edit · /sbox · /sbox diff · /test)
- User:DePiep/cc/data/colornames (edit · talk · history · links · /subpages · /doc · /doc edit · /sbox · /sbox diff · /test)
- User:DePiep/sandbox (edit · talk · history · links · /subpages · /doc · /doc edit · /sbox · /sbox diff · /test)
- WP:LUA
- Arguments (edit · talk · history · links · /subpages · /doc · /doc edit · /sbox · /sbox diff · /test · Template:Arguments)
- User:DePiep/sandbox13=color names
- User:DePiep (edit · talk · history · links · /subpages · /doc · /doc edit · /sbox · /sbox diff · /test)
Color spaces
[edit]color space | data structure | # arg |
example(s) | example color value | source | alternative names, versions | number of colors | wiki page | note | |
---|---|---|---|---|---|---|---|---|---|---|
RGB | triple hex 00-FF | 1 | #cd5c5c | #cd5c5c | W3C, rgb | alt: triplet 0-F (#abc) | ||||
RGB | name | 1 | maroon | #800000 | [2] | CSS 1–2.0 / HTML 3.2–4 / VGA color names | 16 | web colors | HTML 4.01 names (X11 alt names) | |
RGB | w3cname | 1 | indianred indian red |
#cd5c5c | W3C, color keywords | X11 | 147 | X11 color names | Multiple versions are around, sometimes clashing. | |
RGB | trip separated | 3 | rgb(00, 9A, FF) rgb(80%, 36%, 36%) rgb(55, 0, 255) dec mixed |
Values out of range (<0, >255/100%) are clipped (w3c). | ||||||
RGB | triphex | 3 | rgb(c5, 10, a5) | #c510a5 | All hex only. Technically possible; not W3C mentioned. Should never mix with dec values | |||||
RGB | red RGBgreen RGBblue |
cc | 1 | #cc0000 | similar for -green, -blue. | The red part value in RGB. Corresponds with #rr0000(?) | ||||
HSL | trip | 3 | hsl(0°, 53%, 58%) hsl(0, 53, 58) |
#cd5c5c | hue:0° satur:53% light:58%. With or without °, % | |||||
HSL | tripnormalised | 3 | hsl(0, 0.53, 0.58) | #cd5c5c | normalsed into fractions (0 ... 1) (see W3C) | |||||
HSV | trip | 3 | hsv(0°, 55%, 80%) | #cd5c5c | for: hue:0° satur:53% value:580%. With or without °, % | |||||
RGB-lum | Luminance, cset contrast ratio | [3] | {{RGBColorToLum}} and more, for contrast ratio checking | W3C, transparent | ||||||
RGBA | RGBA-transp | 4 | rgba(80%, 36%, 36%, 0.2) | W3C, transparent | 0.0=transp, 1.0=opaque. parameter 4. HSLA w3c hsla | |||||
1.^ "CSS Color Module Level 3 W3C Recommendation 07 June 2011". W3C. 2011-06-07. Retrieved 1013-02-25. {{cite web}} : Check date values in: |accessdate= (help)
|
Resources
[edit]- MediaWiki:User:DePiep/cc (edit | talk | history | links | watch | logs)
- MediaWiki:User:DePiep/cc/data (edit | talk | history | links | watch | logs)
- MediaWiki:User:DePiep/cc/data/colornames (edit | talk | history | links | watch | logs)
- WP:LUA
- MediaWiki:Track gauge (edit | talk | history | links | watch | logs)
- MediaWiki:User:DePiep/sandbox (edit | talk | history | links | watch | logs)
- w3c examples
em { color: #f00 } /* #rgb */ em { color: #ff0000 } /* #rrggbb */ em { color: rgb(255,0,0) } em { color: rgb(100%, 0%, 0%) }
- w3c on color
- css3 color
- w3c sRGB color space sRGB definition
- color in text too
- accity in general
RGBA (alpha=opacity)
[edit]w3c example
em { color: rgb(255,0,0) } /* integer range 0 - 255 */ em { color: rgba(255,0,0,1) /* the same,with explicit opacity of 1 */ em { color: rgb(100%,0%,0%) } /* float range 0.0% - 100.0% */ em { color: rgba(100%,0%,0%,1) } /* the same,with explicit opacity of 1 */]
- error: rgb(1,2,3,4)
- error: rgba(1,2,3,)
- error: rgb(50%,2,3) - mixed num dim
- error: background:dark goldenrod -- OK darkGoldenrod
- alpha default=1
See also / todo
[edit]- X11 color names
- sRGB definition
- List of 8-bit computer hardware palettes
- Template:Color contrast ratio great
- W3C relative luminance value (contrast calcs)
- MediaWiki:Sandbox/isaacl/ColourSpace/Formats/W3Cnames (edit | talk | history | links | watch | logs)
- User:Mr._Stradivarius/Tools stealing ideas
- {{RGBColorToLum}} luminance
- Module talk:Sandbox/isaacl/ColourSpace/testcases
- Module:Sandbox/isaacl/ColourSpace/Formats/W3Cnames --list of names
- Dictionary
- w3c: basic color keywords(=16x), "color keywords" (="color name"), "opacity"="alphavalue" =1 minus tranparency, "color", "sRGB",
- ? SVG 1.1; fading,
- CSS2 system colors deprecated (Menu ect.)
- "currentColor" (SVG, inherited, ...)
- Deprecated: css3 UI "appearance" replaces system colors like "menu" ccs2
- sRGB history
- mw on typography
Sets: Derived colors
[edit]- Shades of Gray to grey
- Web safe
- w3c: "color"; "opacity" == <alphavalue> == 1 − transparency
- to #rgb FFF
- X11
Sets: Pairs
[edit]- Contrast
- grey tone
Color spaces
[edit]formats
[edit]color space | data structure | # arg |
example(s) | example color value | source | alternative names, versions | number of colors | wiki page | note |
---|---|---|---|---|---|---|---|---|---|
RGB | #hex24 | 1 | #cd5c5c | #cd5c5c | W3C, rgb | ||||
RGB | hex24 | 1 | cd5c5c cd 5c 5c |
#cd5c5c | If not a named color (6 characters), 6 hex chars can be concluded to be RGBhex6 | ||||
RGB | #hex3 | 1 | #abc | #aabbcc | W3C, rgb | todo: check logic | |||
RGB | basicname | 1 | maroon | #800000 | [5] | CSS 1–2.0 / HTML 3.2–4 / VGA color names | 16 | web colors | HTML 4.01 names |
RGB | w3cname | 1 | indianred indian red |
#cd5c5c | W3C, color keywords | X11 | 147 | X11 color names | Multiple versions are around, sometimes clashing. |
RGB | tripdec | 3 | rgb(255,0,0) | 16^3 = ~16M | |||||
RGB | tripperc | 3 | rgb(80%, 36%, 36%) | Values out of range (<0, >255/100%) are clipped. | |||||
RGB | tripmixed | 3 | rgb(80%, 120, 36%) | RGB can mix % and dec | |||||
RGB | triphex | 3 | rgb(c5, 10, a5) | #c510a5 | All hex only. Technically possible; not W3C mentioned. Should never mix with dec values | ||||
RGB | red RGBgreen RGBblue |
cc | 1 | #cc0000 | similar for -green, -blue. | The red part value in RGB. Corresponds with #rr0000(?) | |||
HSL | trip | 3 | hsl(0°, 53%, 58%) hsl(0, 53, 58) |
#cd5c5c | hue:0° satur:53% light:58%. With or without °, % | ||||
HSL | tripnormalised | 3 | hsl(0, 0.53, 0.58) | #cd5c5c | normalsed into fractions (0 ... 1) (see W3C) | ||||
HSV | trip | 3 | hsv(0°, 55%, 80%) | #cd5c5c | for: hue:0° satur:53% value:580%. With or without °, % | ||||
RGB | Luminance | tbd | [6] | {{RGBColorToLum}} and more, for contrast ratio checking | |||||
opacity |
0.2 | 20% opacity | W3C, transparent | transparency=future feature. opacity = 1-transparency. 0.0 (fully transparent) to 1.0 (fully opaque) | |||||
rgba(80%, 36%, 36%, 0.2) | W3C, transparent | transparency=future feature. 4th parameter is opacity/transparency | |||||||
hsla(120, 100%, 50%, 0.2) | W3C, hsla | transparency=future feature. hsl with explicit opacity | |||||||
1.^ "CSS Color Module Level 3 W3C Recommendation 07 June 2011". W3C. 2011-06-07. Retrieved 1013-02-25. {{cite web}} : Check date values in: |accessdate= (help)
|
Wikipedia:Lua requests/Archive 1#Color conversion (RGB)
Experiments
[edit]ye | #7bea15=rgb(123,234,21) | rgb(123,234,21) | rgba(123,234,21,.5) |
color:red; rgb(123,234,21) | color:red; rgba(123,234,21,.5) | ||
"color:rgb(255,0,0); background:rgb(123,234,21)" | "color:rgba(255,0,0,0.5); background:rgb(123,234,21)" | ||
"color:rgb(255,0,0); background:maroon" | |||
"color:rgb(255,0,0); background:lime" | |||
"color:rgb(255,0,0); background:darkGoldenrod" | |||
"color:rgb(255,0,0); background:aliceblue" | |||
"color:rgb(255,0,0); background:lime" | |||
"color:rgb(255,0,0); background:rgb(123,234,21)" | |||
"color:rgb(255,0,0); background:#7f0000" | |||
"color:rgb(255,0,0); background:rgb(123,234,21)" | |||
"color:rgb(255,0,0); background:rgb(123,234,21)" | |||
"color:rgb(255,0,0); background:rgb(50%,75%,89%)" | |||
"color:rgb(255,0,0); background:rgb(50.4%,75.4%,89.4%)" | |||
"color:rgb(255,0,0); background:rgb(50.8%,75.8%,89.8%)" |