Creating color contrasts automatically

In this recipe, you will learn to find the right font color for a background color. High contrast plays an important role in web designing. Designs with high contrast help you meet accessibility standards. Color contrast is important for the readability and accessibility of text on the page. High contrast not only helps visibly disabled or color blind people, it also influences those with normal vision, as humans are naturally in favor of high-contrast color designs. This preference plays a role in the first impression of your website.

Getting ready

In this recipe, you will make use of both Sass and Compass. Read the Installing Sass for command line usage recipe of Chapter 1, Getting Started with Sass, to find out more about installing Sass and get the Ruby Sass compiler ready. Color contrast and other calculations are done with the functions and mixins built in Compass. So, read the Installing Compass recipe of Chapter 1, Getting Started with Sass, and...