Match a Charitable Campaign to Your Brand Colors with AI
Give the AI your brand colors and get your campaign's buttons, progress bar, tabs, and headings restyled to match, with the old values saved so you can undo it.
Prerequisites
A connected site running Charitable 1.8.18 or newer on WordPress 6.9 or newer, a campaign built in the visual Campaign Builder, and your brand colors as hex codes.
I use Charitable on my WordPress site. Restyle my campaign [campaign name] to match my brand. My colors are [hex codes with their roles, for example: primary dark green #0F5132, accent gold #B8860B, call-to-action red #B91C1C, body text #1F2937]. Use the Charitable campaign style abilities. First find the campaign and read its current styles, and show me the current values in full so I have a record to undo this with. Only use the color and typography names that the campaign reports it accepts. Propose a mapping of my colors onto those names as a before and after table, covering the primary and secondary colors, text, the donate button and its text, the progress bar, and the tabs. Check that the button text and tab text are readable against their backgrounds, and if a pairing has poor contrast, tell me and suggest white or a dark neutral for the text. Wait for me to confirm. Apply only the values I approved, and do not change the campaign's title, story, goal, status, or donation form. Afterwards, read the styles back and show me what was saved next to what I asked for, plus the campaign's link so I can look at it.
Skip pasting the full prompt. Drop this into your AI on a site that already has WPVibe:
Run the “Match a Charitable Campaign to Your Brand Colors with AI” recipe from the WPVibe cookbook on my connected site.
Campaign templates come with their own colors, and they are rarely yours. A red progress bar and a green donate button on a site that is navy and gold looks like a page from somewhere else, and donors notice when the giving page does not feel like the organization they trust. Fixing it means finding the design panel and changing nine color pickers one at a time, per campaign.
You give the AI your colors and it reads the campaign's current design through Charitable's style abilities, which report exactly which color names that campaign accepts. It maps your palette onto them: primary, secondary, text, button, progress bar, tabs. It shows you the before and after side by side, checks that button text is readable on the button color, and applies the change only when you agree. It changes colors, typography size, and nothing else: your story, goal, and donation form are untouched.
Paste the prompt with your campaign and your hex codes. Two or three colors are enough. The AI will tell you which one it put where. Keep the before values it shows you, since they are your undo. Do this on a draft, or look at the live page right after, because a style change on a published campaign is visible to donors immediately.
Outcome
Your campaign page uses your brand colors and heading size, and you have the previous values written down in case you want them back.