CSS Notes You Should Keep Handy

Let's start with Color Theory.

Our eyes have evolved for hundreds of thousands of years to see colors better. Seeing different colors have played a major role in human evolution as well, as we were able to distinguish poisonous berries from innocuous ones and hence were able to grow food efficiently.

Even today, colors play an important role in our day-to-day lives. Have you ever noticed why packets of chips are mostly stark red and yellow? That's because a combination of these colors signals your brain to release hormones that can make you hungry and crave those chips.

Similarly, colors could play an important role in making your website attractive too. If you know who is your visitor and what kind of mood he or she comes with on your website and what colors they see on it could make all the difference if they will stay on the website longer or not. So let's understand some of the colors now:

Red is a great color to use when power, passion, strength, and excitement want to be transmitted. Brighter tones are more energetic and darker shades are more powerful and elegant.

Orange draws attention without being as overpowering as red. It means cheerfulness and creativity. Orange can be associated with friendliness, confidence, and courage.

Yellow is energetic and gives the feeling of happiness and liveliness. Also, it associates with curiosity, intelligence, brightness, etc.

Green is the color of harmony, nature, life, and health. Also, it is often associated with money. In design, green can have a balancing and harmonizing effect.

Blue means patience, peace, trustworthiness, and stability. It is one of the most beloved colors, especially by men. It is associated with professionalism, trust, and honor. That's actually why the biggest social networks use blue.

Purple is traditionally associated with power, nobility, and wealth. In your design, purple can give a sense of wisdom, royalty, nobility, luxury, and mystery.

Pink expresses romance, passivity, care, peace, affection, etc.

Brown is the color of relaxation and confidence. Brown means earthiness, nature, durability, comfort, and reliability.

Next, let's talk about typography

Beautiful typography too plays a major role in making the content of your website attractive. Curved characters can add a gentle touch to your website whereas a big font size could attract attention first. So let's go through some of such pointers.

1. Use a font size between 15 and 25 pixels for body text

2. Use (really) big font sizes for headlines

3. Use a line spacing between 120 and 150% of the font size

4. Use just 45 to 90 characters per line

5. Make the right selection of fonts at the start of your website itself and make sure the same fonts are used everywhere except for some cases where creativity is required.

6. Chose a font that reflects the look and feels you want for your website.

I always keep the above pointers in mind while making elegant web pages. Hope this can help you too.

We will look at a few more detailed CSS concepts in upcoming blogs. Hope you have a great day!

Happy Coding!