Difference between revisions of "Style Guide"

From Freephile Wiki
Jump to navigation Jump to search
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
A Style Guide addresses the [[Fonts]], colors, layout and other design aspects of your branding.  The scope of your Style Guide might be very broad, or it may just focus on the company website elements.
 
 
 
A long time ago, I created a script that would parse a CSS file and generate the unwritten style guide that's embodied in it.  Until I resurrect that script, you might need to refer to other helpful resources on creating a [http://designmodo.com/create-style-guides/ Style Guide]
 
A long time ago, I created a script that would parse a CSS file and generate the unwritten style guide that's embodied in it.  Until I resurrect that script, you might need to refer to other helpful resources on creating a [http://designmodo.com/create-style-guides/ Style Guide]
  
Line 15: Line 13:
 
<p style="color: #333333; display: block; font-family: 'Trebuchet MS', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 12px;">This is darker text in #333333</p>
 
<p style="color: #333333; display: block; font-family: 'Trebuchet MS', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 12px;">This is darker text in #333333</p>
 
</html>
 
</html>
 
== Typography ==
 
[[File:Eqt.logo.png|thumb|right|Linux Libertine O]]
 
Currently using these free fonts
 
*<span style="font-family:linux libertine O;font-size:2em;">Linux Libertine O: eQuality Technology</span>
 
*<span style="font-family:georgia bold;font-size:2em;">Georgia Bold: eQuality Technology</span>
 
*<span style="font-family:gillius ADF;font-size:2em;">Gillius ADF: enterprise quality = technology freedom</span>
 
 
 
To learn more about GilliusADF, see the [[Fonts]] article
 
  
 
[[Category:Design]]
 
[[Category:Design]]
 
[[Category:Marketing]]
 
[[Category:Marketing]]
[[Category:Style]]
 

Revision as of 13:13, 26 January 2016

A long time ago, I created a script that would parse a CSS file and generate the unwritten style guide that's embodied in it. Until I resurrect that script, you might need to refer to other helpful resources on creating a Style Guide

Really Simple Example[edit | edit source]

This is a navline, or header with background-color:#212121

Heading color #2c2c2c

This is paragraph text in #464946. Links within the text are colored rgb(6, 51, 96) or #063360, and decorated for email

This is darker text in #333333