m (Those are minor things. We rather want to use professional WP pages than a self-advertising blog post. Please don't revert :)) Tag: Help |
m (Rather than just having 'CSS' it would be better to go in depth to clarify what CSS is, and by that, I mean adding the full word.) Tag: Visual edit |
||
| (8 intermediate revisions by 5 users not shown) | |||
| Line 1: | Line 1: | ||
{{tocright}} |
{{tocright}} |
||
| − | |||
'''Color''' is a great tool for helping to make your community stand out as well as match your wiki's topic and theme. |
'''Color''' is a great tool for helping to make your community stand out as well as match your wiki's topic and theme. |
||
| − | ==Step by step== |
+ | == Step by step == |
| − | Color can be added to your community in a couple of different places. For example, you can use unique colors in the [[Help:Theme |
+ | Color can be added to your community in a couple of different places. For example, you can use unique colors in the [[Help:Theme Designer|theme designer]] to customize your look or add color to your community's [[Help:Templates|templates]] via [[Help:Community CSS and JS|CSS]] (Cascading Style Sheets). |
The most common way to define a color is to use its name or hex code. To use a particular color, take the name or hex code below and add it where appropriate. For example, if you want to add it as a button color in the Theme Designer, copy the hex code of that color, then add it to the input field on the Customize tab. |
The most common way to define a color is to use its name or hex code. To use a particular color, take the name or hex code below and add it where appropriate. For example, if you want to add it as a button color in the Theme Designer, copy the hex code of that color, then add it to the input field on the Customize tab. |
||
| Line 10: | Line 9: | ||
Hex values are generally more flexible than color names, as they allow a very wide range of shades. More information about how these work can be found [[wikipedia:Web colors#Hex triplet|on Wikipedia]]. |
Hex values are generally more flexible than color names, as they allow a very wide range of shades. More information about how these work can be found [[wikipedia:Web colors#Hex triplet|on Wikipedia]]. |
||
| − | ==Color names== |
+ | == Color names == |
There are two main types of color names that are preferred, HTML and X11. |
There are two main types of color names that are preferred, HTML and X11. |
||
| − | ===HTML color names=== |
+ | === HTML color names === |
The HTML 4.01 specification<ref>[http://www.w3.org/TR/REC-html40/types.html#h-6.5 HTML 4.01 Specification section 6.5 "Colors"]</ref> defines sixteen named colors, as follows (names are defined in this context to be case-insensitive; the table is alphabetically ordered): |
The HTML 4.01 specification<ref>[http://www.w3.org/TR/REC-html40/types.html#h-6.5 HTML 4.01 Specification section 6.5 "Colors"]</ref> defines sixteen named colors, as follows (names are defined in this context to be case-insensitive; the table is alphabetically ordered): |
||
| Line 63: | Line 62: | ||
|style="background:#FF0; color:#000; font-family:monospace;"|#FFFF00 |
|style="background:#FF0; color:#000; font-family:monospace;"|#FFFF00 |
||
|} |
|} |
||
| − | |||
These 16 were also specified as sRGB and included in the HTML 3.0 specification. |
These 16 were also specified as sRGB and included in the HTML 3.0 specification. |
||
| − | ===Fluorescent |
+ | === Fluorescent colors === |
| − | The neon colors are a typical type of colors that glow on certain pages depending on what color the theme is used through the Theme Designer |
+ | The neon colors are a typical type of colors that glow on certain pages depending on what color the theme is used through the Theme Designer: |
{| class="wikitable" style="font-size:90%;" cellpadding="4" |
{| class="wikitable" style="font-size:90%;" cellpadding="4" |
||
| Line 136: | Line 134: | ||
A large, helpful list of usable color names and equivalent hex codes can be found [[wikipedia:Web colors#X11 color names|on Wikipedia]].<ref>[http://www.w3.org/TR/css3-color/#svg-color W3C TR CSS3 Color Module, SVG color keywords]</ref><ref>[http://www.w3.org/TR/SVG/types.html#ColorKeywords W3C TR SVG 1.0, recognized color keyword names]</ref> |
A large, helpful list of usable color names and equivalent hex codes can be found [[wikipedia:Web colors#X11 color names|on Wikipedia]].<ref>[http://www.w3.org/TR/css3-color/#svg-color W3C TR CSS3 Color Module, SVG color keywords]</ref><ref>[http://www.w3.org/TR/SVG/types.html#ColorKeywords W3C TR SVG 1.0, recognized color keyword names]</ref> |
||
| − | ==References== |
+ | == References == |
| − | <references/> |
+ | <references /> |
| − | ==See also== |
+ | == See also == |
* [[wikipedia:Web colors|Web colors]] at Wikipedia, upon which this page was based |
* [[wikipedia:Web colors|Web colors]] at Wikipedia, upon which this page was based |
||
* http://ficml.org/jemimap/style/color/wheel.html - 4096 Color Wheel |
* http://ficml.org/jemimap/style/color/wheel.html - 4096 Color Wheel |
||
* http://www.colblindor.com/color-name-hue/ - Color Names and Hue by Colblindor |
* http://www.colblindor.com/color-name-hue/ - Color Names and Hue by Colblindor |
||
| − | * Editing your wiki's look with the [[Help:Theme |
+ | * Editing your wiki's look with the [[Help:Theme Designer|Theme Designer]] |
| − | ==Further help and feedback== |
+ | == Further help and feedback == |
{{Help and feedback section}} |
{{Help and feedback section}} |
||
| Line 158: | Line 156: | ||
[[pl:Pomoc:Kolory]] |
[[pl:Pomoc:Kolory]] |
||
[[pt:Ajuda:Cores]] |
[[pt:Ajuda:Cores]] |
||
| + | [[ro:Ajutor:Culori]] |
||
[[ru:Справка:Цвет]] |
[[ru:Справка:Цвет]] |
||
[[zh:Help:顏色]] |
[[zh:Help:顏色]] |
||
| Line 163: | Line 162: | ||
[[Category:Editing]] |
[[Category:Editing]] |
||
[[Category:Source editing]] |
[[Category:Source editing]] |
||
| − | [[Category:Help |
+ | [[Category:Help]] |
| − | [[Category:Customization basics |
+ | [[Category:Customization basics]] |
Revision as of 10:15, 10 March 2018
Color is a great tool for helping to make your community stand out as well as match your wiki's topic and theme.
Step by step
Color can be added to your community in a couple of different places. For example, you can use unique colors in the theme designer to customize your look or add color to your community's templates via CSS (Cascading Style Sheets).
The most common way to define a color is to use its name or hex code. To use a particular color, take the name or hex code below and add it where appropriate. For example, if you want to add it as a button color in the Theme Designer, copy the hex code of that color, then add it to the input field on the Customize tab.
Hex values are generally more flexible than color names, as they allow a very wide range of shades. More information about how these work can be found on Wikipedia.
Color names
There are two main types of color names that are preferred, HTML and X11.
HTML color names
The HTML 4.01 specification[1] defines sixteen named colors, as follows (names are defined in this context to be case-insensitive; the table is alphabetically ordered):
| Color | Hexadecimal | Color | Hexadecimal | Color | Hexadecimal | Color | Hexadecimal |
|---|---|---|---|---|---|---|---|
| cyan | #00FFFF | green | #008000 | navy | #000080 | silver | #C0C0C0 |
| black | #000000 | gray | #808080 | olive | #808000 | teal | #008080 |
| blue | #0000FF | lime | #00FF00 | purple | #800080 | white | #FFFFFF |
| fuchsia | #FF00FF | maroon | #800000 | red | #FF0000 | yellow | #FFFF00 |
These 16 were also specified as sRGB and included in the HTML 3.0 specification.
Fluorescent colors
The neon colors are a typical type of colors that glow on certain pages depending on what color the theme is used through the Theme Designer:
| Color | Hexadecimal | Color | Hexadecimal | Color | Hexadecimal |
|---|---|---|---|---|---|
| Rainshower | #C9FFE5 | Screamin' Green | #66FF66 | Blizzard Blue | #A3E3ED |
| Purple Pizzazz | #FE4EDA | Psychedelic Purple | #FA00FF | Electric Violet | #8B00FF |
| Harlequin | #3FFF00 | Sunglow | #FFCC33 | Bubbles | #E7FEFF |
| Electric Lime | #CCFF00 | Razzle Dazzle Rose | #FF33CC | Snowy Mint | #D6FFDB |
| Electric Purple | #BF00FF | Flamingo Pink | #FF66FF | Hot Magenta | #FF00CC |
| Infra Red | #FF496C | Neon Carrot | #FFA343 | Laser Lemon | #FFFF66 |
| Chartreuse Yellow | #DFFF00 | Phlox | #DF00FF | Shocking Pink | #FC0FC0 |
| Veronica | #A020F0 |
X11 color names
In addition, a wide range of "X11 colors" are defined by web browsers.
A large, helpful list of usable color names and equivalent hex codes can be found on Wikipedia.[2][3]
References
See also
- Web colors at Wikipedia, upon which this page was based
- http://ficml.org/jemimap/style/color/wheel.html - 4096 Color Wheel
- http://www.colblindor.com/color-name-hue/ - Color Names and Hue by Colblindor
- Editing your wiki's look with the Theme Designer
Further help and feedback
- Browse and search other help pages at Help:Contents
- Check Fandom Community Central for sources of further help and support
- Check Contacting Fandom for how to report any errors or unclear steps in this article