Branding
Plans: Starter (badge forced on) · Growth · Pro · Agency (custom domain on Pro+)
Clione's branding settings let you wrap your dashboard, FAQ widget, and shared deliverables in your own visual identity. Two layers:
- Org-level brand — logo, accent color, cover image, custom domain. Applies across all your stores and to shared deliverables.
- Per-store badge toggle — controls whether the "Powered by Clione" badge appears on widgets for that specific store.
The brand surfaces in three places regardless of storefront platform: your dashboard chrome, the FAQ widget rendered on the storefront (BC, Shopify, or headless), and shared deliverables (branded reports and the public Pulse page).
Org-level brand
Sidebar → Org → Brand tab.
Available on Growth, Pro, and Agency. Starter sees a locked panel with the upgrade hint.
Fields
| Field | Used by |
|---|---|
| Logo URL | Dashboard sidebar header, shared deliverables, FAQ widget header. PNG / SVG / JPG, recommended 512px+ on the long edge. Must be https://. |
| Accent color (hex) | Buttons, links, highlights in branded deliverables. Must be a valid #RGB or #RRGGBB. |
| Cover image URL | Cover page of branded deliverables. 1920×400 or similar landscape ratio. |
| Custom domain | For shared deliverables — see Branded reports — custom domain. |
Changes save automatically on blur (Notion-style) for inputs, and on toggle change for checkboxes. The "Saved" indicator briefly appears on each field.
Custom domain
Pro and Agency only. See the Branded reports doc for the full setup walkthrough.
Per-store "Powered by Clione" badge
Per-store toggle under Store → Settings → Branding.
Default state per plan:
| Plan | Default | Can hide? |
|---|---|---|
| Trial | On | No |
| Starter | On | No |
| Growth | On | Yes |
| Pro | On | Yes |
| Agency | On | Yes |
The badge shows in:
- The FAQ accordion footer (
Powered by Clione). - The Pulse public page footer.
- Branded deliverable footers.
When you toggle the badge off, the change applies within ~5 minutes (the widget caches the policy). Hard refresh the storefront page to see it sooner.
The badge enforcement is server-side, not client-side. Flipping the toggle in the database or via the API bypasses no enforcement — Starter accounts will continue to see the badge regardless of what value is stored. This is by design and documented in our Terms of Service.
Per-platform behaviour
Branding is platform-agnostic at the API layer — the same brand JSON is served to every consumer. What differs is the surface where it renders.
BigCommerce
- FAQ widget header — When the embed widget mounts on a BC Stencil page, it fetches the brand JSON and applies your logo + accent color to the accordion header. No theme changes needed.
- Schema Injector — The injected script is platform-agnostic; the brand has no effect on the JSON-LD it injects.
- BC Reviews surface — If you use BC's built-in Reviews, the rating snippet rendered by Clione's JSON-LD uses your accent color in the dashboard preview only; on the storefront, the rating star color is controlled by the Stencil theme, not Clione.
Shopify
- Theme App Extension — The Clione JSON-LD theme app embed reads the brand JSON at render time, so accent color and logo apply to the embedded FAQ block.
- Custom Liquid section — If you embed FAQ via a Custom Liquid section instead of the Theme App Extension, the brand JSON is fetched at runtime by the widget script and applied identically.
- Hydrogen / Remix headless — Your headless storefront fetches
/api/v1/public/brand/:tenantSlugand applies the brand inline. See developers/embed-widget for the snippet.
Headless and other storefronts
The brand JSON is served at https://app.clione.ai/api/v1/public/brand/:tenantSlug. Any headless theme (Next.js, Hydrogen, Catalyst, Sapper, etc.) can fetch it at build time or at runtime. The schema is stable and versioned in the public API docs.
Custom domain DNS
The custom domain works on any DNS provider as long as you can add a CNAME record. Tested combinations:
| DNS provider | CNAME flattening | Notes |
|---|---|---|
| Cloudflare | Yes | Proxy must be off (gray cloud) for the initial cert request; can be turned on after verification. |
| Route 53 | N/A | Use a standard CNAME record. |
| GoDaddy | No | Set CNAME directly. Some legacy GoDaddy accounts add a trailing dot — strip it. |
| Namecheap | No | Direct CNAME. |
| Google Domains / Squarespace Domains | Yes | Works with the flattened ALIAS record. |
| Hover | No | Direct CNAME. |
Troubleshooting
Logo doesn't appear in the sidebar — The URL must be https://. http:// URLs are rejected on save. Check the browser console for a CSP error if the image host blocks hotlinking. Common offenders: Dropbox public links, Google Drive direct links, Imgur. Host the logo on your own domain or on a known image CDN (Cloudinary, Imgix, Bunny, Cloudflare Images).
Accent color isn't applied — Hard refresh. The dashboard caches the brand for 5 minutes. If still wrong after refresh, check the hex format: it must be #RRGGBB or #RGB, no leading word like red.
FAQ widget still shows the badge after toggling off — Widget cache TTL is 5 minutes. Wait or hard-refresh. If after 10 minutes the badge persists, your plan is Starter or Trial — the badge can't be hidden on those plans (see plan defaults above).
Custom domain verification times out — DNS propagation. Wait up to 30 minutes. If still failing, re-check the CNAME record matches exactly what Clione shows (no trailing dot in some providers). Some Cloudflare accounts require turning the proxy off (gray cloud) for the initial Let's Encrypt validation; you can re-enable after the cert issues.
Brand panel is locked — Your plan is Starter. Upgrade to Growth or above to unlock org-level brand customization. The "Powered by Clione" badge remains on Starter regardless.
Brand changes apply to the dashboard but not to my live FAQ widget — Widgets cache the brand JSON for 5 minutes. Hard-refresh the storefront page after waiting. If the change still doesn't propagate after 10 minutes, the widget script may be cached by your CDN — flush the storefront CDN cache for /embed/* paths.
Brand schema (what the API serves)
For the curious, the brand JSON served at /api/v1/public/brand/:tenantSlug looks like:
{
"tenantSlug": "your-org",
"logo": {
"url": "https://cdn.example.com/logo.svg",
"width": 512,
"height": 128,
"alt": "Your Org"
},
"accentColor": "#1f6feb",
"coverImage": {
"url": "https://cdn.example.com/cover.jpg",
"width": 1920,
"height": 400
},
"customDomain": {
"host": "insights.example.com",
"verified": true
},
"badge": {
"force": false,
"enabled": true
}
}
The schema is versioned (X-Brand-Version response header) so consumers can cache safely. Cache-Control is public, max-age=300 by default — 5 minutes.
Multi-tenant brand handling (Agency)
Agency tenants with sub-tenants get one brand per sub-tenant. The sub-tenant brand inherits from the Agency-level brand on first creation but can be overridden per sub-tenant. The brand toggle for the "Powered by Clione" badge also follows the sub-tenant's plan, not the Agency's — so a sub-tenant on Starter would still see the badge forced on, even if the parent Agency is on Pro.
To set the per-sub-tenant brand, sign in as a user with Owner/Admin on the sub-tenant, then visit Org → Brand.
Logo aspect-ratio tips
The logo appears in three places with different aspect ratio needs:
- Dashboard sidebar header — fits a 32px-tall slot, scales by height. Wide logos work fine.
- FAQ widget header — fits a 24px-tall slot. Same constraint.
- Branded report cover — fits a 256px-wide slot, scales by width. Square or near-square logos work best here.
If you have only a square logo, it works everywhere but feels small in the sidebar. If you have only a wide logo, it works everywhere but feels lost on the report cover. The recommended setup is a horizontal lock-up for sidebar/widget use plus an icon mark for the report cover.
Override per surface:
- Logo URL field — the main, applied everywhere by default.
- Logo (square) — optional second slot used by the report cover when filled.
Color contrast guardrails
The accent color is used for buttons, links, and highlights against a white or dark surface. Clione runs a WCAG AA contrast check at save time:
- If the accent color fails contrast against white background (used in light theme), you'll see a warning chip. The change still saves; the warning is a heads-up.
- If the accent color fails against dark background (used in dark theme), same warning.
You can ignore the warning, but the FAQ widget will use a desaturated version of the accent for the button background to keep buttons legible. The full saturation is used for non-interactive elements (icons, dividers).
Brand preview
The Brand tab has a live preview that shows your logo, accent color, and cover image as they will render in:
- The FAQ widget header.
- A branded report cover.
- The public Pulse page badge.
Changes apply immediately to the preview (it reads the form state, not the saved state). Use it to iterate before committing.
Resetting to defaults
Each brand field has a "Reset to default" link next to it. Resetting:
- Logo → falls back to the Clione default mark.
- Accent color → falls back to
#1f6feb. - Cover image → falls back to a generic Clione cover.
- Custom domain → removes the binding (the subdomain CNAME you set up still resolves to Clione's host, but Clione stops associating it with your tenant).
Brand inheritance for sub-tenants
For Agency-plan tenants, branding inheritance works as follows:
- A new sub-tenant inherits the Agency-level brand on creation.
- The sub-tenant Owner/Admin can override any brand field independently.
- The Agency-level brand changes do not retroactively cascade to sub-tenants that have customized.
- The "Powered by Clione" badge default follows the sub-tenant's plan (not the Agency's).
This lets agency operators set sensible defaults at the Agency level (e.g. their own brand) while still allowing end-clients to use their own branding.