Colors in ALPS 3.x

Something that many people appreciate about ALPS is the variety of color themes available. It connects back to one of our key underlying principals of “Customization”. Each site has the option of using one of seven primary colors, two secondary colors and a light or dark background that allowed for many of color options.

ALPS 2.x colors

Color is key to any design. We associate it with our brands and our culture. And as we approached ALPS 3.x, we wanted to build on the existing color themes. It was time offer more options. And some of the themes had accessibility issues, with contrast ratios making it difficult to read. Additionally, the use of the secondary colors in the current system didn’t allow for a lot of nuance in Call to Action buttons or links. It was binary, either a strong color or plain text.

Here are a few things we wanted to accomplish with the updated color system:

  1. Expand color options
  2. Improve readability
  3. Better visual hierarchy

Keeping all this in mind, as we approached ALPS 3.x, we wanted to make some adjustments that would benefit anyone, but not negatively affect those who are using the 2.x system.

The New Colors

As we began working on ALPS 3.x, we took a careful review of the existing colors. Several of the combinations did not meet the WCAG AA contrast ratio recommendations. So we decided to take a second look at our color themes.

The new ALPS 3.x color system includes eight families, each family has a bright, muted, and neutral palette. Each of the colors in the family has been tested to ensure good visual contrast, offer guidance in the throughout the page, and create a discoverable interface. Each family has a key color and four supporting colors.


ALPS 3.x Bright colors


ALPS 3.x Muted colors

Universal Neutrals

Universal Neutral colors for ALPS 3.x

Note: The colors highlighted above are palettes that were included in ALPS 2.x.


  • | February 14, 2018 at 4:55 pm

    Thanks Brent, that’s a lot of nice colour options!
    How is ALPS 3 coming along generally?

    • | February 14, 2018 at 4:57 pm

      Things are coming very well. Over the next couple weeks, we will be releasing more information, demos and previews.

  • | February 14, 2018 at 5:00 pm

    Looking forward to any & all offerings you throw out to us 🙂

Leave a Comment

Your email address will not be published. Required fields are marked *