 CSS is often thought of as a way to layout a website or position your page elements. However, CSS is just as useful in controlling the style or design of your site with the use of color. But before I get into the technicalities of it all, let’s use our imaginations for just a moment. When it comes to websites, it is said (correctly, in my opinion) that content is king. Well, imagine if content were a real, living, breathing, king. Our king is standing high on a balcony addressing his people. The sort of speech he is giving is up to you; he may be an evil king tightening his grip on his subjects or a benevolent king spreading good news and cheer. Imagine either, both, or anything in between, and tell me one thing: what color are the king’s robes? Humans apply style and design to just about everything. Furthermore, humans associate color with moods and ideals, and these moods and ideals may vary depending on culture and gender. The colors you choose to use with your website should align itself with the sort of audience that you want to attract. First, let’s look at how to apply colors to page elements and then a closer at how colors are associated with moods and ideals across gender and culture.
Applying Color to Page Elements with CSS There are several different methods of assigning colors in CSS. Some of these methods are easier to read and understand while others offer more flexibility (and are used more often). Using Color Names
You can assign a color simply by using one of the 16 color names in your CSS definition. The colors are: white, black, silver, gray, red, maroon, purple, fuchsia, blue, navy, teal, aqua, yellow, green, lime, and olive. You assign them in the following manor:
color: red;
If you were assigning them to a paragraph tag, you would do it like this:
p {color: red;}
Using RGB Values by Percentage
You can assign a color by defining the RGB (Red Blue Green) values separately with percentages. For example, this would give you a shade of purple:
color: rgb(90%, 48%, 90%);
Using RGB with Literal Values
This option allows you to use the literal RGB values to assign a color. The following code results in a pretty orange color:
color: rgb(245, 178, 17);
Using Hexadecimal Values
Hexadecimal values have been around for a long time and are used in other applications and programming languages. If you use Photoshop or do any programming, you’ve probably seen these before. Using hex values seems to be the most popular, so I’ll spend a little more time explaining it. Hex values use the following format: #RRGGBB, which defines a pair of digits for Red, Green, and Blue. Unlike base 10 (which is how most humans make measurements), hexadecimal is base 16. The values range from 0 to 9, and then A to F (which simply take the place of 10 to 15). Since hexadecimal uses a pair of base 16 numbers to represent a number, 256 (16 x 16) separate values are possible for each color, and 16,777,216 (256 x 256 x 256) combinations. That’s a lot of colors! To make the point clear, #FF0000 is pure red, #00FF00 is pure blue, and #0000FF is pure green. Here’s a tip for hex colors if color values are in pairs. You can use a shorthand format to reduce a value like #44FF22 to #4F2 by using only the first value in each pair. Color Associations Among Cultures and Gender People associate colors with different feelings or ideals and these can vary between genders and across cultures. Numerous studies have been done to see which colors are interpreted in what ways. The table below lists common colors and their associations. Common Colors and their Associations | Color | Associations | | White | Purity, clean, precision, innocence, sterilty | | Black | Power, sophistication, mystery, fear, death | | Gray (or Silver) | Futuristic, Intelligence, modesty, sadness | | Brown | Comfort, reliability, earth, endurance | | Violet | Royalty, religion, mystery | | Yellow | Hope, optimism, philosophy, cowardice | | Orange | Fun, happiness | | Green | Earth, nature, health, renewal, jealousy | | Blue | Trust, secure, order, clean, conservative | | Red | Energy, love, power, passion, aggression |
Colors can have different meanings to different people depending on their culture and gender. This next table lists common colors and their significance to different cultures as well as their preference among men and women.
Influences of Color in Gender and Cultures | Color | Influence in Culture and Gender | | White | Purity, chastity in Western society. Mourning and death in many Asian cultures. | | Black | Mourning, death in most Western cultures (and many others). | | Brown | Usually a neutral color in most cultures and in gender. | | Violet | In Europe, associated with mourning, but is also associated with alternative religions (so it could be controversial). | | Yellow | A sacred, imperial color in Asian cultures. Women often prefer yellow to orange and associate it with optimism and warmth. | | Orange | Most men prefer orange to yellow. Orange can have a strong emotional tie to the Irish, as it represents Protestantism. | | Green | Associated with money and wealth in the United States. Green has strong emotional ties in Ireland, as it represents Irish Catholic. Most women can identify more named shades of green than men. | | Blue | In many Eastern countries, blue is the color of immortality. It is also the color of holiness for the Jews and represents Krishna in Hinduism. It is revered throughout the world and is probably the most globally safe color. Most men prefer blue to red. | | Red | Red is the color of good luck in China and is intensified when mixed with white. Most women prefer red to blue. | I hope this has helped you to learn the different ways to style your site with colors in CSS, as well as the impact color choices can have on your audience.
 |
Joomla Tutorials 
Dec.20
Subscribe to this comment's feed
I hope this allowed, I have never used this website before so I wasn't really sure what this was going to do. wholesale nfl jerseys So this is just a test post. I really like this forum, it has some excellent discussions that take place.