Colors

Learn more about how you can change the color scheme for Pixel Bootstrap UI Kit

Color scheme

We have already carefully selected the optimal color scheme for Pixel, but your business may need another color palette. Here’s how you can change the colors using Sass.

Go to the scss/pixel/_variables.scss file and search for the following variables:

$primary: #0648B3 !default;
$secondary: #EE5050 !default;
$tertiary: #05A677 !default;

If you want to override colors, update one of the variables in the custom/_variables.scss file like this:

$primary: red;
$secondary: blue;

You’ll then notice that the two main colors will be changed to red and blue. You can update any variable like this, not just the colors.

Change the hex color for each variable to the color palette that you desire.