Test Color: Difference between revisions
Jump to navigation
Jump to search
mNo edit summary |
No edit summary |
||
| (One intermediate revision by the same user not shown) | |||
| Line 24: | Line 24: | ||
* <code><nowiki><span style="background:#FF0000; color:white; text-align:center;">Red Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:#FF0000; color:white; text-align:center;">Red Background white print: 0</span></nowiki></code> | ||
: <span style="background:#FF0000; color:white; text-align:center;">Red Background white print:: 0</span> | : <span style="background:#FF0000; color:white; text-align:center;">Red Background white print:: 0</span> | ||
* <code><nowiki><span style="background:#FA8072; color:black; text-align:center;">Red Background black print: 0</span></nowiki></code> | |||
: <span style="background:#FA8072; color:black; text-align:center;">Red Background black print:: 0</span> | |||
* <code><nowiki><span style="background:#FFA07A; color:black; text-align:center;">Red Background black print: 0</span></nowiki></code> | |||
: <span style="background:#FFA07A; color:black; text-align:center;">Red Background black print:: 0</span> | |||
<span style="background:#FF2400; color:white; text- ;">'''Scarlet''' </span> | |||
** <span style="background:#FF2400; color:white;"> <nowiki> <span style="background:#FF2400; color:white;"></nowiki> scarlet Background white print: 0 </span> | |||
*** <span style="background:#FF0000; color:white; text-align:center;"> <nowiki> <span style="background:#FF0000; color:white; text-align:center;"></nowiki> Red #FF0000 Background white print: 0 </span> | |||
** <span style="background:#FFF5F7; color:black; text-align:center;"><nowiki> <span style="background:#FFF5F7; color:black;"></nowiki></span> | |||
** <span style="background:#FFE6EA; color:white; text-align:center;">350 #FFE6EA Background white print: 0</span> | |||
* <code><nowiki><span style="background:#00FF2A; color:white; text-align:center;">130 green Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:#00FF2A; color:white; text-align:center;">130 green Background white print: 0</span></nowiki></code> | ||
: <span style="background:#00FF2A; color:white; text-align:center;">130 green Background white print: 0</span> | : <span style="background:#00FF2A; color:white; text-align:center;">130 green Background white print: 0</span> | ||
* <code><nowiki><span style="background:#98FB98; color:black; text-align:center;">PALEgreen Background black print: 0</span></nowiki></code> | |||
: <span style="background:#98FB98; color:black; text-align:center;">PALE green Background black print: 0</span> | |||
* <code><nowiki><span style="background:#00FF2A; color:black; text-align:center;">YELLOW green Background black print: 0</span></nowiki></code> | |||
: <span style="background:#CCFF00; color:black; text-align:center;">YELLOW green Background black print: 0</span> | |||
* <code><nowiki><span style="background:green; color:white; text-align:center;">green Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:green; color:white; text-align:center;">green Background white print: 0</span></nowiki></code> | ||
: <span style="background:green; color:white; text-align:center;">green Background white print: 0</span> | : <span style="background:green; color:white; text-align:center;">green Background white print: 0</span> | ||
* <code><nowiki><span style="background:blue; color:white; text-align:center;">blue Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:blue; color:white; text-align:center;">blue Background white print: 0</span></nowiki></code> | ||
: <span style="background:blue; color:white; text-align:center;">blue Background white print: 0</span> | : <span style="background:blue; color:white; text-align:center;">blue Background white print: 0</span> | ||
* <code><nowiki><span style="background:#ADD8E6; color:black ; text-align:center;">blue Background black print: 0</span></nowiki></code> | |||
: <span style="background:#ADD8E6; color:black ; text-align:center;">blue Background black print: 0</span> | |||
* <code><nowiki><span style="background:#87CEEB; color:black ; text-align:center;">LIGHT blue Background black print: 0</span></nowiki></code> | |||
: <span style="background:#87CEEB; color:black ; text-align:center;">blue Background black print: 0</span> | |||
* <code><nowiki><span style="background:red; color:white; text-align:center;">red Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:red; color:white; text-align:center;">red Background white print: 0</span></nowiki></code> | ||
: <span style="background:red; color:white; text-align:center;">red Background white print: 0</span> | : <span style="background:red; color:white; text-align:center;">red Background white print: 0</span> | ||
* <code><nowiki><span style="background:black; color:white; text-align:center;">black Background white print: 0</span></nowiki></code> | * <code><nowiki><span style="background:black; color:white; text-align:center;">black Background white print: 0</span></nowiki></code> | ||
: <span style="background:black; color:white; text-align:center;">black Background white print: 0</span> | : <span style="background:black; color:white; text-align:center;">black Background white print: 0</span> | ||
* <code><nowiki><span style="background:#DCDCDC; color:black; text-align:center;">GREY Background black print: 0</span></nowiki></code> | |||
: <span style="background:#DCDCDC; color:black; text-align:center;">GREY Background black print: 0</span> | |||
* <code><nowiki><span style="background:#C0C0C0; color:black; text-align:center;">GREY Background black print: 0</span></nowiki></code> | |||
: <span style="background:#C0C0C0; color:black; text-align:center;">GREY Background white print: 0</span> | |||
* <code><nowiki><span style="background:#A9A9A9; color:black; text-align:center;">GREY Background black print: 0</span></nowiki></code> | |||
: <span style="background:#A9A9A9; color:black; text-align:center;">GREY Background black print: 0</span> | |||
==<span id="Color generation guide">Colour generation guide</span>== | ==<span id="Color generation guide">Colour generation guide</span>== | ||
Latest revision as of 16:37, 9 June 2024
Overriding font colour Overriding font color
To make a word have colour, use:
<span style="color:hex triplet or colour name">text</span>
Examples color text:
<span style="color:red">red writing</span>- shows as red writing
<span style="color:#0f0">green writing</span>- shows as green writing
<span style="color:#0000FF">blue writing</span>- shows as blue writing
<span style="color:red">'''Bold red writing'''</span>- shows as Bold red writing
<span style="color:green">'''Bold green''' writing</span>- shows as Bold green writing
<span style="color:blue">'''Bold blue''' writing</span>- shows as Bold blue writing
Background
<span style="background:#FF0000; color:white; text-align:center;">Red Background white print: 0</span>
- Red Background white print:: 0
<span style="background:#FA8072; color:black; text-align:center;">Red Background black print: 0</span>
- Red Background black print:: 0
<span style="background:#FFA07A; color:black; text-align:center;">Red Background black print: 0</span>
- Red Background black print:: 0
Scarlet
- <span style="background:#FF2400; color:white;"> scarlet Background white print: 0
- <span style="background:#FF0000; color:white; text-align:center;"> Red #FF0000 Background white print: 0
- <span style="background:#FFF5F7; color:black;">
- 350 #FFE6EA Background white print: 0
<span style="background:#00FF2A; color:white; text-align:center;">130 green Background white print: 0</span>
- 130 green Background white print: 0
<span style="background:#98FB98; color:black; text-align:center;">PALEgreen Background black print: 0</span>
- PALE green Background black print: 0
<span style="background:#00FF2A; color:black; text-align:center;">YELLOW green Background black print: 0</span>
- YELLOW green Background black print: 0
<span style="background:green; color:white; text-align:center;">green Background white print: 0</span>
- green Background white print: 0
<span style="background:blue; color:white; text-align:center;">blue Background white print: 0</span>
- blue Background white print: 0
<span style="background:#ADD8E6; color:black ; text-align:center;">blue Background black print: 0</span>
- blue Background black print: 0
<span style="background:#87CEEB; color:black ; text-align:center;">LIGHT blue Background black print: 0</span>
- blue Background black print: 0
<span style="background:red; color:white; text-align:center;">red Background white print: 0</span>
- red Background white print: 0
<span style="background:black; color:white; text-align:center;">black Background white print: 0</span>
- black Background white print: 0
<span style="background:#DCDCDC; color:black; text-align:center;">GREY Background black print: 0</span>
- GREY Background black print: 0
<span style="background:#C0C0C0; color:black; text-align:center;">GREY Background black print: 0</span>
- GREY Background white print: 0
<span style="background:#A9A9A9; color:black; text-align:center;">GREY Background black print: 0</span>
- GREY Background black print: 0
Colour generation guide
- The method used for selecting the colours for various top-level pages, e.g. Main Page, Community Portal, Contents, ??.
The 3 colours are generated using the??
| Hue | Saturation 4% Brightness 100% main background |
Saturation 10% Brightness 100% 2nd header, accent colour |
Saturation 15% Brightness 95% main border header background |
Saturation 15% Brightness 75% header border only |
|---|---|---|---|---|
| Note. for layouts with no spacing between borders, use the darker border colour. | ||||
| Hue: 0 | #FFF5F5 | #FFE6E6 | #F2CECE | #BFA3A3 |
| Hue: 10 | #FFF7F5 | #FFEAE6 | #F2D4CE | #BFA7A3 |
| Hue: 20 | #FFF8F5 | #FFEEE6 | #F2DACE | #BFACA3 |
| Hue: 30 | #FFFAF5 | #FFF2E6 | #F2E0CE | #BFB1A3 |
| Hue: 40 | #FFFCF5 | #FFF7E6 | #F2E6CE | #BFB6A3 |
| Hue: 50 | #FFFDF5 | #FFFBE6 | #F2ECCE | #BFBAA3 |
| Hue: 60 | #FFFFF5 | #FFFFE6 | #F2F2CE | #BFBFA3 |
| Hue: 70 | #FDFFF5 | #FBFFE6 | #ECF2CE | #BABFA3 |
| Hue: 80 | #FCFFF5 | #F7FFE6 | #E6F2CE | #B6BFA3 |
| Hue: 90 | #FAFFF5 | #F2FFE6 | #E0F2CE | #B1BFA3 |
| Hue: 100 | #F8FFF5 | #EEFFE6 | #DAF2CE | #ACBFA3 |
| Hue: 110 | #F7FFF5 | #EAFFE6 | #D4F2CE | #A7BFA3 |
| Hue: 120 | #F5FFF5 | #E6FFE6 | #CEF2CE | #A3BFA3 |
| Hue: 130 | #F5FFF7 | #E6FFEA | #CEF2D4 | #A3BFA7 |
| Hue: 140 | #F5FFF8 | #E6FFEE | #CEF2DA | #A3BFAC |
| Hue: 150 | #F5FFFA | #E6FFF2 | #CEF2E0 | #A3BFB1 |
| Hue: 160 | #F5FFFC | #E6FFF7 | #CEF2E6 | #A3BFB6 |
| Hue: 170 | #F5FFFD | #E6FFFB | #CEF2EC | #A3BFBA |
| Hue: 180 | #F5FFFF | #E6FFFF | #CEF2F2 | #A3BFBF |
| Hue: 190 | #F5FDFF | #E6FBFF | #CEECF2 | #A3BABF |
| Hue: 200 | #F5FCFF | #E6F7FF | #CEE6F2 | #A3B6BF |
| Hue: 210 | #F5FAFF | #E6F2FF | #CEE0F2 | #A3B1BF |
| Hue: 220 | #F5F8FF | #E6EEFF | #CEDAF2 | #A3ACBF |
| Hue: 230 | #F5F7FF | #E6EAFF | #CED4F2 | #A3A7BF |
| Hue: 240 | #F5F5FF | #E6E6FF | #CECEF2 | #A3A3BF |
| Hue: 250 | #F7F5FF | #EAE6FF | #D4CEF2 | #A7A3BF |
| Hue: 260 | #F8F5FF | #EEE6FF | #DACEF2 | #ACA3BF |
| Hue: 270 | #FAF5FF | #F2E6FF | #E0CEF2 | #B1A3BF |
| Hue: 280 | #FCF5FF | #F7E6FF | #E6CEF2 | #B6A3BF |
| Hue: 290 | #FDF5FF | #FBE6FF | #ECCEF2 | #BAA3BF |
| Hue: 300 | #FFF5FF | #FFE6FF | #F2CEF2 | #BFA3BF |
| Hue: 310 | #FFF5FD | #FFE6FB | #F2CEEC | #BFA3BA |
| Hue: 320 | #FFF5FC | #FFE6F7 | #F2CEE6 | #BFA3B6 |
| Hue: 330 | #FFF5FA | #FFE6F2 | #F2CEE0 | #BFA3B1 |
| Hue: 340 | #FFF5F8 | #FFE6EE | #F2CEDA | #BFA3AC |
| Hue: 350 | #FFF5F7 | #FFE6EA | #F2CED4 | #BFA3A7 |
| H: 0 S: 0 | #FFFFFF | #F9F9F9 | #F2F2F2 | #BFBFBF |
- Easily generate similar palettes, from different starting hues, using colorblender.com
Wikimedia colour schemes Wikimedia color schemes
Wikipedia
Wikipedia uses this colour scheme on its Main Page.
- Please note that the colour for the border on the lighter boxes is also the colour of the backgrounds of the darker (title) boxes.
| Hue: 150 | background:#F5FFFA border:#CEF2E0 | background:#CEF2E0 border:#A3BFB1 | ||
| Hue: 210 | background:#F5FAFF border:#CEE0F2 | background:#CEE0F2 border:#A3B1BF | ||
| Hue: 270 | background:#FAF5FF border:#E0CEF2 | background:#E0CEF2 border:#B1A3BF | ||
| Hue: 330 | background:#FFF5FA border:#F2CEE0 | background:#F2CEE0 border:#BFA3B1 |
And additionally on the Community Portal:
| Hue: 030 | background:#FFFAF5 border:#F2E0CE | background:#F2E0CE border:#BFB1A3 |
Additional 3-colour palettes using this same generation scheme are at the top of the talk page. In the Monobook skin, the background colour of Wikipedia pages is #F8FCFF. In the Vector skin, the background colour on all pages is #FFFFFF.
Commons
The Wikimedia Commons uses this colour scheme on commons:Main Page and commons:Help:Contents. Differing from the English Wikipedia, Commons does not use an extra, darker colour for bordering the header. Also, the colour sets are not derived from a hue the way the above table does.
|
background colour: #d0e5f5
background colour: #f1f5fc |
background colour: #faecc8
background colour: #faf6ed |
Tables
| Column 1 Heading | Column 2 Heading | Column 3 Heading |
|---|---|---|
| Column 1 Row 1 | Column 2 Row 1 | Column 3 Row 1 |
| Column 1 Row 2 | Column 2 Row 2 | Column 3 Row 2 |
| Column 1 Row 3 | Column 2 Row 3 | Column 3 Row 3 |
{| class="wikitable" style="text-align: center; color: green;"
|- style="background-color:#efefef;"
! Column 1 Heading!! Column 2 Heading!! Column 3 Heading </nowiki>
|-
|Column 1 Row 1
|Column 2 Row 1
|Column 3 Row 1
|-
|Column 1 Row 2
|Column 2 Row 2
|Column 3 Row 2
|-
|Column 1 Row 3
|Column 2 Row 3
|Column 3 Row 3
|}
| Icon | Function | What it shows when editing | What it shows on the page |
|---|---|---|---|
| Attribute | The early Levites: | The early Church: | |
| Called | Ministers of God have always been called by God to be His "called out". | ||
| The Levites were the people who answered the call to come out and follow the ways of God.[1] | The Apostles were called to come out and serve God by teaching the people the ways of God.[2] | ||
| a | l | c | |
Footnotes
- ↑ Exodus 32:26 Then Moses stood in the gate of the camp, and said, Who [is] on the LORD’S side? [let him come] unto me. And all the sons of Levi gathered themselves together unto him.
- ↑ Matthew 4:19 And he saith unto them, Follow me, and I will make you fishers of men.
- Matthew 8:22 But Jesus said unto him, Follow me; and let the dead bury their dead.
- Matthew 9:9 And as Jesus passed forth from thence, he saw a man, named Matthew, sitting at the receipt of custom: and he saith unto him, Follow me. And he arose, and followed him.
- Matthew 16:24 Then said Jesus unto his disciples, If any man will come after me, let him deny himself, and take up his cross, and follow me.
- Matthew 19:21 Jesus said unto him, If thou wilt be perfect, go and sell that thou hast, and give to the poor, and thou shalt have treasure in heaven: and come and follow me.
- Mark 2:14 And as he passed by, he saw Levi the son of Alphaeus sitting at the receipt of custom, and said unto him, Follow me. And he arose and followed him.
- ↑ Matthew 6:24 No man can serve two masters: for either he will hate the one, and love the other; or else he will hold to the one, and despise the other. Ye cannot serve God and mammon. Luke 16:13 No servant can serve two masters: for either he will hate the one, and love the other; or else he will hold to the one, and despise the other. Ye cannot serve God and mammon.