BACKGROUND COLOR CSS GRADIENT CODE

Okay, this isnвЂ™t a perfect solution because itвЂ™s not really transparent. But as soon as you put the text on a dark background, the illusion is revealed. The pink value simulates what a 50% transparent red looks like.

When the background changes, though, the difference will become clear: For example, if you know that a block of text will appear on a white background, you could use the value rgb(255, 127, 127) to make it look about 50% transparent. The following CSS should cover IE and everyone else:ДЄdjusting colors in IE so that they look more like transparent colors is possible. If a browser encounters a value it doesnвЂ™t understand, itвЂ™s supposed to ignore it and render whatever other value is set for that property. The only question left is, what about browsers that donвЂ™t support RGBa? I do hear that one browser that a few people are still using (say, 70 to 75% of the browsing public) still doesnвЂ™t support any CSS3, including RGBa. That might change, but for now RGB is the future of color on the web.ДЄs long as the userвЂ™s browser supports CSS3, you can use an RGBa value to get transparency wherever thereвЂ™s a color value: in text, backgrounds, borders, outlines, text shadows, box shadows-anywhere. Why canвЂ™t HEX support a similar syntax? Well, it can, actually, as weвЂ™ll see a bit later, but the W3C has no apparent plans to add it to its color specifications. A value of 0 is equivalent to the transparent color value.Д¬olor values, from opaque to transparent. When you use RGBa, be sure to specify rgba() as the value (note the a), and then add the alpha value as a fourth comma-separated value, ranging from 0 (transparent) to 1.0 (opaque). Adding an alpha value to an RGB color is simplicity itself:Д«oth of these values produce red at 50% opacity. HereвЂ™s a reason to start using RGB values: they can include an alpha value to create opacity. But if you limit yourself to web-safe colors, itвЂ™s time to move on anyway. The only thing HEX shorthand is good for is web-safe colors.

BACKGROUND COLOR CSS GRADIENT CODE

This is significant only if youвЂ™re strict about code optimization, though.

HEX has a slight advantage over RGB: itвЂ™s compact-even more so if youвЂ™re use the shorthand (three values instead of six). IвЂ™m funny that way: I can figure out a color with values from 0вЂ“255 or 0вЂ“100% much faster than one with values from 00вЂ“99 or aaвЂ“ff. IвЂ™m a human being with 10 fingers, so imagining colors that use base-10 values is easier than imagining ones that use base-sixteen values. Still, I prefer trying out colors in RGB. HEX and RGB systems can define the millions of colors available on your screen equally well:ДЄll of these color value settings produce the same result. ItвЂ™s just that most developers (and designers) got used to defining colors in HEX and have had no reason to change. RGB color values are supported in every browser you can think of, so theyвЂ™re nothing new.

Some forward-thinking websites, such as the impressive 24 Ways to Impress Your Friends, are already playing around with RGBa for text and background color effects-and the results are great.Дў uses opacity and RGBa to create a cool layered design.Дespite what some of the developers IвЂ™ve been sparring with recently might think, RGB has been around on the web for a while. What will happen is that color values will be defined in new ways, the entire spectrum of opacity levels will be added and gradients based on pure CSS rather than images will be thrown in, too. No, new hues will not be added to the rainbow. CSS3 has arrived, and your palette is about to get a whole lot bigger.Д¬ompared to whatвЂ™s coming, itвЂ™s sas though designers have been color-blind, working with only a small part of the chromatic spectrum. Perhaps youвЂ™ve been playing around with hexadecimal color values since you were a wee web-babe if you were, get ready to to grow up fast. The way you handle color in your web designs is about to change.

Background color css gradient