Mastering CSS3 Colors
4.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
52 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Mastering CSS3 Colors to your Wishlist.

Add to Wishlist

Mastering CSS3 Colors

Conjure up stunning web pages using CSS3 Colors
4.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
52 students enrolled
Created by Packt Publishing
Last updated 1/2016
Current price: $10 Original price: $50 Discount: 80% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 1 hour on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Explore core color properties to understand the importance of colors in web designing
  • Use RGB and HSL colors to create millions of color combinations on different digital devices
  • Integrate alpha channels into your colors to extend the usability of RGB and HSL colors
  • Figure out the best design for you using external images, Adobe CC, and ColorZilla
  • Work with dynamic colors in CSS using the currentColor keyword
  • Watch the transparent color feature in action in tandem with gradients to make your sites more appealing
  • Make your sites stand out and more accessible by adding alternative images for visually impaired audiences as well
View Curriculum
  • This video course will help you in extending your working knowledge with colors in CSS to create web pages that stand out.

Colors have been around the Web since the very early days. Before the birth of CSS, color attributes were baked into HTML or into images. As the Web evolved and moved into a CSS-friendly world, colors were extracted and moved into style files. Colors are at the very heart of display and graphical representations. It's critical for any developer or web designer to understand colors and their relationships in-depth, so that they can be more creative and gain control over the style and design of their websites.

Mastering CSS3 Colors aims to introduce ways you can control color using CSS3 features and shows you how to become artistic to create stunning web pages.

We will start off with understanding how color systems work and more importantly how we need to work with them. We will get to know all about core colors, web-safe colors, and named colors. We'll then dive into creating color profiles in RGB and HSL, and also learn how to incorporate alpha channels into these profiles. We’ll learn all the neat tricks to pick perfect color themes for our pages using external images, Adobe Color CC, and ColorZilla.

Next we'll turn our attention to relative colors and the use of currentColor, transparency, and gradients, making our sites fancier than ever. Finally, we’ll look at web accessibility and make our site user-friendly for everyone.

Before you know it, Mastering CSS3 Colors will have you up-to-speed with the best tricks and hacks to create captivating web pages, faster and more effectively than ever.

About The Author

Ben Fhala discovered his passion for data visualization while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school and an Adobe ACP. He enjoys spending most of his time learning and teaching, and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT&T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards.

Among Ben's publications are HTML5 Graphing and Data Visualization Cookbook, and five video courses: jQuery UI Development; Learning Object-Oriented JavaScript; Mastering JavaScript; JavaScript Design Patterns; Web Visualization with HTML5, CSS3, and JavaScript, all for Packt Publishing.

Who is the target audience?
  • This video course is aimed at web designers and developers who are comfortable building simple websites with HTML and CSS, and may know some JavaScript.
Compare to Other CSS Courses
Curriculum For This Course
10 Lectures
Exploring CSS3 Colors
6 Lectures 43:34

This video will offer the overview of the course.

Preview 01:43

There are many ways to describe what a color is. The most basic way is using a name.

Preview 04:58

Let's learn the common ways to describe colors on digital devices using the color profile options. By the end of this video, you will know how to create color profiles in RGB.

Understanding RGB

In this video, you will learn a more modern way of representing RGB values. This new way will enable you to incorporate alpha channels.

Integrating an Alpha Channel

RGB colors have a few limitations; mainly, they are hardware oriented based on 16 million color assumptions. It's harder to use—it is easy to understand but really hard to figure out colors with this system. There are a few other color profilers out there but the second one that is supported, which is very nattily logical, is the HSL. HSL is far more intuitive, making it easier to control colors in a human-friendly way.

Hue, Saturation, Lightness, and Alpha

It's one thing to know how to work with colors and another to find color profiles that work together. In this video, we will talk about the easiest way to create color profiles and add a brand meaning to our colors. By the end, you will be a lot more comfortable with colors as you will figure out your own designs.

Finding Color Profiles
Diving Deeper into CSS3 Colors
4 Lectures 18:00

So far, we've worked with colors by defining them in absolute terms: by name, RGB or HSL values. We now turn our attention to relative colors. The first of them is currentColor. The currentColor keyword enables us to get a reference to the current color. This can become very handy, and we will explore it in this video.

Preview 04:52

At first sight, the transparent color seems odd, but it's really powerful when used mainly in combination with the gradient interface in CSS3. In this video, you will be introduced to the transparent color and see it in action using linear-gradient interface.

The Transparent Color

In our earlier videos, we talked about colors and web safe colors. There are some colors that are reserved for use of the OS/browser. Through the use of CSS2 system colors, we can ask the browser for the system colors. With this color set, we can incorporate system colors into our design.

CSS2 System Colors

As we wrap up another title, let's talk about accessibility.

Color Accessibility
About the Instructor
Packt Publishing
3.9 Average rating
8,197 Reviews
58,887 Students
687 Courses
Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.