Web Development Style Guide

Color Palette: Code Blooded Cyber (Roughly!)

Background Dark Purple

#10092B

First Section Mid Blue

HSLA(215, 45%, 60%, 0.4);

Second Section Bright Blue

#6881FF

Third Section Lighter Purple

#3F0D8A

Useful Links for Website Colors & UI Stuff:

Adobe Color Wheel:
If you're struggling to pick out a color palette for your website,
this website lets you pick a base color and a palette scheme and does the rest of the work for you!


Haikei:
This site is pretty awesome if you want to keep things simple and put in an interesting SVG background!
The Layered Waves background is the SVG used throughout this website, used as a background image in the various divs.


Ultimate Google Font Pairings:
This site has a huge collection of professionally paired together Google Fonts rendered so you can see how they look!
You can even download the fonts locally or this site will give you the code to embed into your stylesheets!














Font Choices: Code Blooded Cyber

Playfair Display

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Helvetica

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Source Sans Pro

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Text Styles: Examples


Main Heading

Subheading

Paragraph Text