If your account has brand colors saved, they now show up as the first row of the Primary Accent Color picker in account settings. You can set your accent color with one click instead of copying a hex code out of a style guide.
The accent color is the color PublicInput uses for buttons and survey step tabs on your public pages. Picking it straight from your brand colors keeps those pages on brand without guessing at hex values or asking someone to look them up.
Before you start
This is available on every account now. You don't need to ask for it.
The brand row only shows up when your account has brand colors saved. Brand colors live in the Brand colors card on the Custom Styling tab of account settings, and only account administrators can add or change them. If nobody has set them up yet, start there.
Changing the accent color itself works the same way it always has. The only new thing is the row of brand colors at the top of the picker.
What you can do with brand colors in the accent picker
Set the Primary Accent Color to one of your brand colors with a single click.
See the same brand colors first in other color pickers on your account, including the email builder, the text editor, map pickers and poll pickers, so the accent color matches everything else you build.
Keep using the standard color rows, the color field and the hex box exactly as before when you need a color that isn't one of your brand colors.
Where to find it
Open your account settings and stay on the General tab. Find Primary Accent Color and click the color box next to it to open the picker. Your brand colors are the first row, above the standard colors. The brand row shows up in the same spot on both the classic settings page and the newer settings layout.
Step by step
If your brand colors aren't saved yet, open the Custom Styling tab in account settings. In the Brand colors card, add each color with a hex value and a name, then click Save brand colors. Skip this step if they're already there.
Go to the General tab and find Primary Accent Color.
Click the color box to open the picker. Your brand colors are the first row, in the same order they appear in the Brand colors card.
Click the brand color you want. The hex box on the right updates to show its value.
Click Choose. The accent color saves and the field shows the new hex value.
Picking a brand color copies its hex value
When you click a brand color, the picker copies that color's hex value into the accent color setting. The accent color doesn't remember which brand color it came from. If someone later edits or removes that brand color in the Brand colors card, your accent color stays the same. To match the new brand color, open the picker again and pick it. This is how the other pickers on your account work too. A brand color is a quick way to choose a value, and once it is saved, that value belongs to whatever you used it on.
The same goes for the other direction. Changing the accent color doesn't add anything to your brand colors. If you pick a one-off color from the standard rows or type a hex value, it is saved as the accent color only.
If your account has no brand colors saved, the picker opens straight to the standard colors and looks exactly as it did before this change.
Tips and limits
You can save up to 12 brand colors, and each name can be up to 40 characters.
Name each brand color the way your style guide does. A clear name helps teammates tell two similar blues apart in the Brand colors card.
Enter colors as hex values, like #0B6FB8 or #FFF. PublicInput saves them in uppercase. If the same color is entered twice, only the first one is kept.
The Brand colors card shows whether each color passes AA contrast with white text and with black text. AA is the accessibility standard for normal-size text. Since button labels sit on top of the accent color, a color that passes is a safer pick.
PublicInput already picks white or black text for your accent color automatically to keep it readable, so you don't need to set that yourself.
If the brand colors fail to load for any reason, the picker still opens with the standard colors, so you can always set an accent color.
Note: Brand colors are shared across the account. Any change in the Brand colors card shows up in every picker that uses them the next time that page loads.