Using CSS for Better Two Color Fonts

Using CSS for Better Two Color Fonts

Building a striking website logo requires a lot of creativity, and many site owners find themselves wanting to incorporate a split-color design in order to draw the visitor's attention to specific areas more. CSS allows you to easily apply a gradient effect to various text forms, but there is a way to directly split the font colors in half without the faded appearance of gradients involved. The script is quite simple, and it is even easy enough for novices to find out how to use.

In order to execute the split-color effect, you're going to have to find out the color ratios that you will be using inside the coding. For instance, maroon is 128,0,0, and yellow is 255,255,0. The specific content property of this form of CSS coding will implement the :before elements or the :after elements, depending on which colors you want to appear first in the combination. This CSS variant utilizes the data char aspects of CSS, which is pretty common and easy to initially learn. The result will appear as two different colors split halfway through the text. Although the script is compatible with any size or font face, it is more noticeable in large and bold text forms. This is why most designers typically use the code for larger text areas such as logos or headers. The final result is one that is much more eye-catching than gradient designs, due to the switch being more blunt and forceful as opposed to slowly fading into a different hue.

Applying two different colors to a single string of text is a great way to draw attention to areas of your website that you consider priority. Visitors will be initially captivated to the specific message, allowing it to sink in much more effectively. Even if you're just looking to add some extra fun and personality to your site's design, the split-color concept is a great way to accomplish it.

For more information click here http://www.blogofbooks.com/book/css#chapter3.

CSS