How to | Customize Brand Settings

With hapily Brand Settings, you can maintain full visual alignment across your entire event ecosystem. Customizing your primary colors, button styles, typography, and background designs ensures that your registration flows, automated confirmation emails, and embedded website modules match your company's official brand guidelines.

This approach allows you to:

• Customize visual assets across registration flows, automated emails, and embedded modules.
• Preview design updates in real time for both registration screens and confirmation emails.
• Apply exact brand hex codes for precise primary, accent, and text color matching.
• Tailor UI details including button corner rounding, font styles, and background gradients.

🎥 Video Walkthrough:

hapily Brand Settings Overview - Watch Video

Step 1: Navigate to Brand Settings

1. Log into hapily and navigate to Settings in the main navigation menu.
2. Select Preferences from the settings menu.
3. Click on the Branding tab to open the brand design editor.

Step 2: Customize Colors, Buttons, and Typography

Use the styling controls on the left panel to update your visual identity. You can track your changes live using the interactive preview panel on the right side of the screen.

1. Colors: Set your primary, accent, and background colors by dragging the color picker or entering your brand's specific hex codes.
2. Buttons: Choose your button fill color, adjust the text color, and choose your preferred shape style (e.g., Rounded or Square).
3. Typography: Select your desired font family from the preset list of Google fonts to match your website typography.

Step 3: Configure Banner and Background Styling

Tailor the outer container and header elements of your registration flows and confirmation emails.

1. Banner Design: Set the background color and styling for your header banner.
2. Background Design: Choose how the page background behind your registration flow displays:
   • Solid Color: Pick a single static background color.
   • Image: Upload a custom background image asset.
   • Gradient: Select starting and ending colors along with the gradient direction (e.g., diagonal top-left to bottom-right).

Step 4: Preview and Save Your Changes

1. Toggle the preview viewer on the right panel between Registration Flow and Confirmation Email to review how your styles look across different attendee touchpoints.
2. Verify that button styles and color schemes render cleanly. Note: These button and color preferences will automatically carry over to any hapily registration modules embedded on external pages or HubSpot landing pages.
3. Click Save to apply your updated brand settings across your portal.

Next Steps:

• Advanced Registration Modules
• Registration Types Explained