Skip to main content
Your community members deserve an experience that feels like it’s truly yours. Customize the user-facing platform with your logos, brand colors, typography, and theme settings. From peacock (bright and distinctive) to penguin (monochrome and professional), make your community unmistakably yours.
Settings Location: Navigate to Control Room > Settings > Branding & Appearance to customize how your community looks to users.

​
Three Customization Areas

The Branding & Appearance settings are organized into three tabs:

Logos & Assets

Upload your brand visuals—logos, favicons, and backgrounds

Colours

Build your complete color palette for light and dark modes

Fonts & Typography

Choose fonts and customize text sizes across the platform

​
Logos & Assets

Upload your organization’s visual identity. These appear in your community’s user-facing interface:

Navbar Logo

100×100pxAppears in the user app’s navigation bar. Your logo’s home.

Logo

200×200pxThe main logo. Used in headers and key places your users see.

Favicon

32×32pxAppears in browser tabs when users visit. Tiny but mighty—your brand’s calling card.

Apple Touch Icon

180×180pxShows up when someone saves your community to their home screen (iPhone, iPad). Your brand, bookmarked.
Pro tip: PNG format with a transparent background works best for everything. Keep file sizes under 5MB.

​
Organization Background Image

Add a background image to the login and onboarding screens your users see. Recommended size: 1920×1080px or larger. This is your welcome mat—make it count.

​
Colours

Build a complete color palette for your user-facing community experience. Your color choices automatically adapt to light and dark modes.
The live preview updates in real-time as you customize, so you can see exactly how your choices look on buttons, badges, cards, and form elements your users will interact with.

​
Light Mode Colors

Configure the color scheme for users in light mode:

Primary Colors

Primary Background and Primary Text — Your brand’s hero colors, used for buttons and interactive elements.

Secondary Colors

Supporting colors for secondary actions and hover states.

Background Colors

Main Background and Main Text — The foundation of your interface’s readability.

Card Colors

Colors for card components and containers throughout the platform.
Plus more: Muted colors (progress bars, subtle elements), Accent colors (badges and highlights), Status colors (success and destructive states), and Interface colors (borders and input fields).

​
Dark Mode Colors

Customize the entire palette again for dark mode. Same categories, different values. Most organizations tweaks a few key colors and lets the rest adapt, but full control is yours.

​
Fonts & Typography

Control how text looks across your platform.

​
Font Family

Choose your primary font from the platform’s library (currently defaulting to Inter). This font is used throughout buttons, inputs, and text everywhere.
Inter is a clean, highly readable default. If you want something more distinctive, reach out—we can discuss custom font options.

​
Font Sizes

The platform uses a typographic scale from XS (extra small) to 6XL (extra extra large). Each size includes the rem value and pixel equivalent:
  • XS: 0.75rem (12px)
  • SM: 0.875rem (14px)
  • BASE: 1rem (16px) — Your default body text size
  • LG: 1.125rem (18px)
  • XL: 1.25rem (20px)
  • 2XL: 1.5rem (24px)
  • 3XL–6XL: Progressively larger for headings and emphasis
These scale consistently across all screen sizes, so everything looks right on mobile, tablet, and desktop.

​
Border Radius

Control how rounded your UI elements are. Options range from sharp corners to soft, friendly curves. This affects buttons, cards, inputs, and containers.

​
Theme Settings

Control how your users experience light and dark modes.

​
Theme Mode

Choose how your community appears:
  • System (User Choice)
  • Force Light
  • Force Dark
Your users can toggle between light and dark mode. Defaults to their device preference. Most people appreciate the choice.

​
Separate Dark Mode Assets

If your logo or background looks better in a specific color scheme, toggle this on. You can upload different logos and backgrounds for light and dark mode instead of using the same version everywhere.

​
Real-Time Preview

As you customize, watch a live preview show how your community will look:
  • Buttons, badges, and interactive elements in your colors
  • Card and container styling
  • Form inputs and controls
  • Your brand colors in context
The preview shows both light and dark modes, so you can see exactly what your users will experience.

​
Next Steps

  1. Start with your logo and primary color — Usually the quickest wins
  2. Watch the preview update — See how your brand colors flow through the interface
  3. Test on mobile — Most of your users will be on phones
  4. Save and refine — You can always come back and adjust
Your community should look unmistakably like your brand. Make it happen.