From the course: Learning Responsive Web Design in the Browser

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Color tools in the browser

Color tools in the browser - WordPress Tutorial

From the course: Learning Responsive Web Design in the Browser

Start my 1-month free trial

Color tools in the browser

“

- [Voiceover] A big part of the design process is experimenting with colors and in design applications color experimentation is really easy because we can use color droppers and color spaces and transparencies and so on to experiment. What if I told you all of this is possible in the browser as well. You see the developer tools not only allow us to apply basic hex colors to our rules which is what you normally do, we can also use them to pick colors from a color space or even apply transparencies or pick colors from within the browser. When we do so, we can switch between hex, RGBA and HSLA markup and that's not all. If we look at this element that we applied a background color to previously in the course you'll notice I used the HSLA values. So it's a blue of 197 degrees. It has 53 percent saturation and 64 percent lightness and a transparency of .8. So if I want to I can just go in and alter these values and see what happens. I can make this into maybe 120 so it's green. I can make…

Contents