Theme and Branding

RackHelm is white-label: your customers should see your brand, not ours. The Theme Settings screen holds your logos, the admin and client colour palettes, the colours for the two modern store templates, and a free-text custom CSS box for anything the pickers do not cover.

Before you start #

Note: Requires the edit_company_settings permission. In a default install only a Super Admin sees the sidebar entry.

Prepare your images first. All three uploads are capped at 2 MB each and accept JPEG, PNG, GIF, BMP and WebP. Uploaded files are written to the public storage disk, which means the public/storage symlink must exist — the installer creates it, but see the troubleshooting table if images do not appear.

Warning: The favicon field is labelled Favicon (ICO, PNG, SVG), but the upload validator accepts only the five raster formats above. An .ico or .svg file is rejected. Use a PNG.

Open Platform Settings → Theme Settings (/admin/settings/theme). Everything on the page saves together with Save Theme Settings.

Branding and logos #

A preview of the current image is shown above each upload once one is set. Leaving an upload empty keeps the existing file.

General appearance #

Tip: Save this screen once immediately after installing, even if you change nothing. Both dark-mode switches are stored as explicit values only when the form is submitted; until then they read as off regardless of how the checkbox appears.

Colour palettes #

There are three blocks of colour pickers, thirty-eight in total. Every one is an <input type="color"> and is validated as a six-digit hex value, so you cannot paste an arbitrary string into it.

Light Mode Colors and Dark Mode Colors #

These two blocks share the same ten roles and set the portal chrome. The defaults differ per mode.

Store Template Colors #

These only take effect when the matching store template is selected under Platform Settings → General & System → Store Template. The Classic template does not use them.

Modern Dark has eight pickers: Gradient Start (#4c1d95), Gradient End (#1e3a5f), Card Background (#1e1e2f), Card Border (#2d2d44), Accent Color (Prices) (#10b981), Button Gradient Start (#7c3aed), Button Gradient End (#2563eb) and Popular Plan Glow (#7c3aed).

Modern Clean has ten: Heading Gradient Start (#2563eb), Heading Gradient End (#7c3aed), Card Background (#ffffff), Card Shadow Color (#d1d5db), Accent 1 (Blue) (#2563eb), Accent 2 (Purple) (#7c3aed), Accent 3 (Green) (#059669), Accent 4 (Orange) (#ea580c), Button Color (#2563eb) and Popular Plan Border (#7c3aed).

Custom CSS #

The Custom CSS box takes up to 65,535 characters and is appended to the end of the theme stylesheet that both the admin area and the client portal render inline in the page head, so it comes after — and therefore overrides — the colours chosen above.

.navbar-brand img { max-height: 42px; }
.dash-kpi .kpi-val { letter-spacing: -0.02em; }

Warning: HTML tags are stripped from this field before it is saved and again when it is rendered, so it accepts stylesheet rules only — do not try to include a <style> wrapper or a script. Bad CSS here affects every page including the admin area, so test a change on a page you can still navigate away from.

Troubleshooting #