Navigate to the Design Settings sidebar via the Design Settings tab in the top right of your Run CMS.

In the Design Settings sidebar, click Choose Your Color Palette to edit your website colors. We provide a variety of presets to choose from, and also allow you fully customize your palette in our advanced palette builder.

Run has a cutting-edge palette builder, useful not only for your website, but also for building your campaign or brand colors for use outside of the website. Our tool is unique in that it takes 4 background colors and automatically calculates all the text colors, button colors, and accents colors, to create a unified system where your brand colors can sit on top of each other as text and graphics.

By opening up the Advanced Customization box, you can get far more granular control of your website colors, with the ability to manually override some or all of Run's automatically generated colors.

To start with are global "Accent Colors." We automatically select two of the background colors to serve as accent colors, but these can be changed, and will affect many of the remaining automatically calculated colors who derive from them.

Below that are the automatically generated colors, which can be unlocked and edited individually.

The Web Content Accessibility Guidelines (AA level) are a common standard used to determine whether text has enough contrast to be readable by users with "moderately low vision" who are not using any additional assistive reading technology. In order to enable AA standards, turn on the "AA-level Accessibility Contrast Standards" toggle (it will be purple when on). By turning this on, our automatic color calculator will force your automated colors to WCAG contrast levels on your palette and throughout your website. If you use our Advanced Customization section to override colors, we will not force them to any particular standard, even if the AA toggle is on.

In our Advanced Customization section, you can always see the calculated contrast of any color against it's background as a number, and if it's not up to AA standards they'll have a yellow warning icon next to them.

Most blocks on the Run site have the option to change the background color to any one of your five background colors. The Run system will automatically color the rest of the block's text and accent colors to match the selected background color.

In some cases, most dramatically the header block, we allow the overriding of the colors of specific elements in the block, but most blocks currently do not allow this. If you really want to customize your colors without using the palette builder, advanced users can use the Insert Code blocks on Page Settings or Sites Settings to insert custom CSS rules.

We will be adding colors to the text editor itself at some point in the next few months.

Feel free to manually copy the color ("hex") codes from your palette builder, but if you want a slick looking PDF "brand guide" that lists all your background, text, and accent colors, reach out to us at [email protected]. We're building a tool that will allow users to do this automatically for a small charge, and in the mean time, we're offering to do it manually for $50 upon request.