Modality
Documentation
Sign inGet Started
Docs/Brand Kit

Brand Kit

Centralize your brand identity for consistent use across email campaigns, event pages, forms, and AI-generated content. The Brand Kit ensures every touchpoint reflects your brand.

Colors, Fonts, and Voice

Brand Colors

Define your brand palette with four color roles:

  • Primary — your main brand color, used for buttons and CTAs
  • Secondary — complementary color for accents and secondary elements
  • Accent — highlight color for badges, links, and interactive elements
  • Navbar — the color used for navigation bars in event pages and emails

How to Set Brand Colors

  1. Navigate to Brand Kit in the sidebar and click the "Colors" tab.
  2. Click any color swatch to open the color picker. Enter a hex code or use the visual picker.
  3. A live palette preview shows all four colors together so you can verify harmony.
  4. Click Save. Your brand colors immediately appear as preset swatches in every color picker throughout Modality — the email editor, form builder, and event page designer.
Brand Kit colors section with editable swatches and palette preview

Fonts

Choose a heading and body font from over 70 Google Fonts. The font picker includes a searchable dropdown with live preview of each font. Selected fonts are used in email campaigns, event pages, and AI-generated content. System fonts (Arial, Georgia, Times New Roman) are also available for maximum email client compatibility.

Brand Voice

Configure how AI writes content for your brand:

  • Voice preset — choose from professional, casual, playful, authoritative, or friendly
  • Custom guidelines — write specific instructions like "Always use first person plural (we/our)" or "Avoid jargon"
  • Industry context — tell the AI about your industry for more relevant content

Logos and Assets

Uploading Assets

  1. Click the "Assets" tab in the Brand Kit.
  2. Click "Upload" or drag and drop files into the upload area.
  3. Supported formats: PNG, JPG, SVG, WebP, and GIF.
  4. Assign a category to each asset: Logo, Photo, Graphic, or Icon.
  5. Assets are available in the email editor's image picker and are automatically used by AI Campaign Studio.

Logo Management

Upload your primary logo and optional dark-mode variant. The logo appears in:

  • Email campaign headers (via the Logo block in the editor)
  • Published form headers
  • Event pages
  • AI-generated campaign content
For best results, upload logos with a transparent background in SVG or PNG format. Recommended minimum width is 200px.

AI Website Extraction

If you already have a website, Modality's AI can extract your brand identity automatically.

How to Extract Brand Assets from a Website

  1. 1

    Enter your website URL

    Click "Extract from Website" on the Brand Kit page and paste your website URL.

  2. 2

    AI analyzes your site

    The AI scans your website for colors, fonts, logos, and images. It identifies your color palette from CSS, finds logo images, and detects font families.

  3. 3

    Review and apply

    The results appear in a preview showing extracted colors, detected fonts, and found images. Toggle individual items on or off, then click "Apply" to update your Brand Kit.

AI extraction consumes 1-2 AI credits depending on the complexity of your website. Results are suggestions — you can always adjust them manually after applying.

PDF Guidelines Upload

Upload your existing brand guidelines as a PDF and Modality's AI will extract colors, fonts, voice guidelines, and other brand elements automatically. This is useful when you have formal brand documentation from a designer or agency.

  1. Click "Upload Brand Guidelines" on the Brand Kit page.
  2. Select a PDF file containing your brand guidelines.
  3. AI analyzes the document for color values, font names, tone of voice, and logo usage rules.
  4. Review extracted values and apply them to your brand kit.

Brand Kit Defaults

Your brand kit settings are automatically applied as defaults when creating new content across Modality:

  • Forms — new forms inherit brand colors, fonts, and button styles
  • Events — event pages use brand colors, fonts, logo, and cover image defaults
  • Email Campaigns — the email editor pre-loads brand colors as swatches and uses brand fonts
  • Invoices — invoice emails, public payment pages, and templates use brand logo, colors, and fonts

"Apply to All" Buttons

If you update your brand kit after creating content, use the "Apply to All" buttons to push your current brand kit settings to all existing events and forms. This bulk action updates colors, fonts, and logos across your entire workspace in one click.

"Apply to All" only updates items that use default brand kit values. Items with manually overridden styles are not affected.

Invoice Branding

The brand kit flows through to every part of the invoicing experience:

  • Invoice emails — your logo appears in the header, brand colors style the email, and brand fonts are used for typography
  • Public payment pages — the customer-facing payment page displays your logo, uses brand colors for buttons and accents, and applies brand fonts
  • Email templates — the invoice email template editor includes brand color swatches and font options
← AutomationsAI Assistant →