My Website Style Guide

Sample Colors

Blue:
rgb(0,5,255)

Red:
rgb(250,0,0)

Green:
rgb(0,255,0)

Turquiose:
rgb(0,255,255)

Gray:
rgb(100,100,100)

Yellow:
rgb(255,255,0)

NOTES: rgba takes a 4th argument between 0 and 1. An argument of .0 means it will be transparent and 1 means it is solid. Other colors that can be used are hsl() and hsla() which take 3 and 4 arguments. The "h" stands for hue / color, the "s" stands for saturation (grayscale -- colorful) and the "l" stands for lightness / brightness.

Sample Fonts

Special

Frijole: Hello 1234

Press: Hello 1234

Sancreek: Hello 1234

Easy to Read

Courier: Hello 124

Asul: Hello 1234

Chivo: Hello 1234

Roboto Mono: Hello 1234

Other Fonts

Istok-italic: Hello 1234

Acme: Hello 1234

NOTES: Most fonts can be accessed using google fonts. It's suggested to add new fonts in as a link in the head section of the index html file. To see how to reference linked fonts click on the link to open css styles. Look for all comments that with /* latin */ to see the key words used.

Prefered Styles

No more than two fonts.
Max of 3 colors per page.
Use h1 once for main title.
Use src:url(../file) for background images in css rather than html.
No more than two columns.
Link new fonts as html link.
Use classes and occasional id's.