Book Image

Bootstrap Site Blueprints

Book Image

Bootstrap Site Blueprints

Overview of this book

Table of Contents (16 chapters)
Bootstrap Site Blueprints
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Implementing the color scheme


We've been provided with a business-friendly palette of blue, red, and gray. Let's work these colors into our color variables:

  1. Open _variables.less in your editor. We'll be working at the beginning of the file, in the color variables.

  2. Let's review the range of grays we have available. If you've begun with the 04_Code_BEGIN files, you'll see we've carried these variables over from Chapter 2, Bootstrappin' Your Portfolio. They served us well there, and we'll make use of them again here.

    // Grays
    // -------------------------
    
    @gray-darker:            #222; // edited
    @gray-dark:              #454545; // edited
    @gray:                   #777; // edited
    @gray-light:             #aeaeae; // edited
    @gray-lighter:           #ccc; // edited
    @gray-lightest:          #ededed; // edited
    @off-white:              #fafafa; // edited
  3. Now, below the grays, let's fold in our new brand colors. We'll modify the value for @brand-primary and create an @brand-feature variable for red:

    @brand...