Donors feel more at ease landing on a donation page that matches your organization’s branding than if they see a form with a completely different look. Part of keeping your branding consistent is maintaining a similar color theme on your donation form and website.
You can obtain the color code for various colors on your website by visiting an HTML color picker website and uploading an image, such as your organization’s logo or a screenshot from your site, that contains the colors you’d like to use. You can then enter the code in Form Builder to change the colors of the buttons and text on your donation form to exactly match the color scheme of your organization’s website!
Please note: There are downloadable color-picker tools, but we’re very careful about advocating any kind of downloads that don’t come directly from us. If you’re comfortable downloading one of these tools, feel free!
Contents:
Obtaining a Color Code
Please note: We do not own or manage ImageColorPicker.com. If you run into difficulty with the site, we are unable to troubleshoot.
To get started, navigate to http://imagecolorpicker.com/.
Click the Use your image button.
In the resulting window, you can choose an image in several different ways. To use an image you have saved on your computer, select the Upload image tab, and then click Browse or drop image.
This will open your computer’s files. Select the image file you’d like to upload and click Open.
Your image should now appear in the preview window. All you have to do is click the color you’d like in the image — the color and code will appear to the left of the preview window, as shown below.
Highlight the HEX code and copy it to your clipboard (you don’t need to include the # sign). Now you can paste it in Form Builder.
Adding the Color to Form Builder
In the Theme Settings area of Form Builder, click either Primary Color or Text Color to bring up the corresponding color tool.
Pro tip: You can edit Text Color for specific elements using the Individual Content Styles area at the bottom of the Theme tab.
In the resulting pop-up, paste or type the code in the field next to the # symbol, and then click OK.
Click Save Page in your toolbar. The button color will update in the editing window.
You can also exit Form Builder and click View Form if you’d like to see what your donors will see. Have fun customizing your form!