Confirmed users
54
edits
Websites/Taskforce/Proposals/Common Color Palette: Difference between revisions
Websites/Taskforce/Proposals/Common Color Palette (view source)
Revision as of 00:37, 18 February 2011
, 18 February 2011no edit summary
(Moving repository browsers out of the list) |
No edit summary |
||
| Line 12: | Line 12: | ||
=Solution= | =Solution= | ||
A solution would be to develop a common color palette to be used as a basis for Mozilla's websites. As apparent in the image above, dark blue, red, orange, yellow, light blue, and green are all common colors in the Mozilla universe. Preferably 6 (or more if needed) "Mozilla Colors/Gradients" would be developed and implemented to enhance the connection between the websites in the Mozilla universe, and to strengthen the Mozilla brand. | A solution would be to develop a common color palette to be used as a basis for Mozilla's websites. As apparent in the image above, dark blue, red, orange, yellow, light blue, and green are all common colors in the Mozilla universe. Preferably 6 (or more if needed) "Mozilla Colors/Gradients" would be developed and implemented to enhance the connection between the websites in the Mozilla universe, and to strengthen the Mozilla brand. | ||
==Proposal== | |||
<table cellspacing="2" cellpadding="5" border="0" style="clear: both; width: 100%; empty-cells: show; background: #eee;"> | |||
<tr> | |||
<th style="width: 150px;">Name</th> | |||
<th style="width: 80px;">Solid</th> | |||
<th style="width: 80px;">Gradient</th> | |||
<th>Hex values</th> | |||
</tr> | |||
<tr> | |||
<td>Header Blue</td> | |||
<td style="background: #33589f; height: 40px;"></td> | |||
<td style="background: -moz-linear-gradient(270deg, #3b69b1, #2a4187);"></td> | |||
<td>Solid: #33589f<br>Gradient: #3b69b1 to #2a4187</td> | |||
</tr> | |||
<tr> | |||
<td>Aside Blue</td> | |||
<td style="background: #cce2f3; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #cce2f3</td> | |||
</tr> | |||
<tr> | |||
<td>Button Green</td> | |||
<td style="background: #74ba32; height: 40px;"></td> | |||
<td style="background: -moz-linear-gradient(270deg, #84c63c, #57a21f);"></td> | |||
<td>Solid: #74ba32 <br>Gradient: #84c63c to #57a21f</td> | |||
</tr> | |||
<tr> | |||
<td>Foundation Gray</td> | |||
<td style="background: #262626; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #262626</td> | |||
</tr> | |||
<tr> | |||
<td>Foundation Red</td> | |||
<td style="background: #a5151e; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #a5151e</td> | |||
</tr> | |||
<tr> | |||
<td>Foundation Link Blue</td> | |||
<td style="background: #148cb5; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #148cb5</td> | |||
</tr> | |||
<tr> | |||
<td>Mascot Red</td> | |||
<td style="background: #ff1a00; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #ff1a00</td> | |||
</tr> | |||
<tr> | |||
<td>Mascot Orange</td> | |||
<td style="background: #fcaa00; height: 40px;"></td> | |||
<td></td> | |||
<td>Solid: #fcaa00</td> | |||
</tr> | |||
</table> | |||
=Scope= | =Scope= | ||