Skip to main content

Branding System

RiDDiX - Matrix Synapse Panel includes a full white-label branding system that lets you customize the public registration page for each server.

Overview

The branding system supports:

  • Visual Identity — app title, subtitle, logo, favicon, hero image, background image
  • Theme — primary/secondary/accent/background/panel/text colors, button and input styles, border radius, shadow intensity, spacing density
  • Layout — five presets: centered, split-screen, left-image, top-branding, compact
  • Content — welcome headline, registration text, success message, footer, support text
  • Links — privacy policy, imprint, terms of service, help page
  • Presentation — homeserver display name, client recommendation, post-registration instructions

Workflow

  1. Create a branding profile (Admin → Branding → Create)
  2. Edit fields across tabbed sections (Visual Identity, Theme, Layout, Content, Links, Presentation)
  3. Preview changes in the live preview panel
  4. Save as draft
  5. Publish to make it the active profile
  6. Reset to defaults at any time

All changes are versioned and audit-logged.

Layout Presets

PresetDescription
CenteredForm centered on page (default)
Split ScreenImage left, form right
Left ImageBranding image alongside form
Top BrandingLogo and title above form
CompactMinimal invite page

Theme Options

Colors

All colors are hex values (e.g., #6366f1):

PropertyDefaultDescription
Primary Color#6366f1Buttons, links, accent elements
Secondary Color#8b5cf6Secondary actions
Accent Color#f59e0bHighlights, warnings
Background Color#f8fafcPage background
Panel Color#ffffffCard/form background
Text Color#0f172aPrimary text

Styling

PropertyOptionsDefault
Button Stylesolid, outline, ghostsolid
Input Styledefault, filled, underlinedefault
Border Radiusnone, sm, md, lg, xl, fullmd
Shadow Intensitynone, sm, md, lgmd
Spacing Densitycompact, normal, relaxednormal

Asset Uploads

Upload images for the registration page:

PurposeMax SizeFormats
Logo2 MBPNG, JPEG, WebP, GIF
Favicon256 KBPNG, JPEG, WebP, ICO
Hero Image2 MBPNG, JPEG, WebP, GIF
Background Image2 MBPNG, JPEG, WebP, GIF
warning

SVG files are blocked to prevent XSS attacks.

Assets are stored in data/uploads/branding/ (persisted via the Docker uploads volume). Each upload generates a UUID filename. Existing assets for the same purpose are replaced automatically.

Per-Server Branding

Each managed server can be linked to a branding profile:

  1. Create a branding profile in Admin → Branding
  2. Publish the profile
  3. Go to Admin → Servers → [Server] → Edit
  4. Set the Branding Profile to the desired profile

When users visit the registration page for that server, the linked branding profile is applied.

Public Branding API

The active branding configuration is served at GET /api/branding. It returns the resolved branding with defaults applied for any unset fields. Asset URLs are returned as /api/branding/assets/:id paths.

Security

  • storagePath is stripped from all API responses
  • Path containment check prevents directory traversal in asset serving
  • File type, size, and extension are validated on upload
  • All text fields have Zod length limits (no raw HTML injection)
  • All branding mutations are audit-logged