How do I add brand colors to my contribution page?

Your contribution page should be a natural continuation of your brand. Luckily, RevEngine’s page style customizer makes it easy to program colors and fonts and apply them to your contribution pages.

This article focuses on setting colors, to set your page fonts, see How do I change the font on my contribution page?.

Things to know

• Configuring colors on your page style will require you to use hex codes. A hex code is a mixture of numbers and letters - or sometimes all numbers or all letters - preceeded by a hashtag (ie #ff0000). Each code represents a specific shade of color and tells your page which one to display.
• If your organization has a style guide, it may contain the hex codes for your branding. If not, you can use a color picker tool to identify the colors on your site and then paste the codes into the fields on your page style.

Setting page colors

Colors are configured for each page using the Style Tab of the page editor.

To set colors for your page:

1. Sign in at RevEngine
2. Click on the page you wish to modify to enter the page editor
3. Navigate to the Style tab
4. When prompted, customize the following elements with hex values by either inputting your HTML hex codes to each field or by using the built-in color selection tool:
   1. Header: Color behind the logo
   2. Background: Color of the area behind the form section
   3. Panel background: Background of the form section
   4. Buttons: Color of CTAs (calls to action) and user-selected items
   5. Accents: Color for checkmarks appearing for each of your member benefits
5. Save your changes to the Style tab. You should now see your page editor update so that you can visualize the styled page before saving
6. When done making edits, save your page by clicking the Save icon on the left panel