Color is an important part of any site. It can draw people in or turn them off. Ever try to read a website with a royal blue background with white writing? It’s like they learned how to use color on a website, but never stopped to think about why.
I’m not a good designer, but there are tools online to help you pick out good colors and good color combinations. Different hues of the same color are usually safe to pair, and each color has a complementary color or colors as well.
Color can set the tone for your site, and you can look at examples to see what feeling they produce. Grays are good if you want to show your technological sophistication. Browns are good for studious sites. Yellow is for happy. Red is exciting. Blue is the most likely favorite color of your viewer, so it’s a good bet.
There are several ways to write the color into your code. The most common way is to use a hex value, written with a hashtag followed by six letters/numbers. #000 is black and #fff is white. They get short codes because they are most common. You can also get a color’s RGB value (how much red, green, and blue is in each color). They are interchangeable. Both the examples below will bring up the same color.
color: #318e58
background-color: rgb(49, 142, 88)
The color property changes the font color. Background-color (one word) is the property of the background color for whatever you are selecting. It can be the whole site or just a portion. If you fill a div with a background color, it will look like a box on the page. You can put a background color behind just one word by using span. That will look like highlighting.
Color Picker
https://color.adobe.com/create/color-wheel/
Color Schemes
https://www.canva.com/learn/website-color-schemes/
Design Inspiration
You can see the video lesson.