Skip to content

Branding & themes

CertIntel has four visual themes - Brutal (the default), Classic Blue, Liquid and Phosphor - and each can be shown in light or dark mode. The same themes appear on this wiki, the public website, the dashboard and the Windows Agent, but each place remembers its choice differently.

Wiki and website theme

Use the Theme picker in the wiki header to choose a theme; the adjacent light/dark button controls color mode independently. The choice is shared between certin.tel and wiki.certin.tel through cookies, so both sites look the same. The first time you change it a notice titled Your appearance preferences asks whether to Remember my appearance; with that on, the choice is kept for up to a year. With it off, or when cookies and browser storage are blocked, the choice lasts only for the current page. See Privacy & cookies. This is a personal preference for the public sites only; it does not change your tenant, dashboard or Agent settings.

Agent screenshots on this wiki follow your wiki theme and light/dark mode. Click an image to open it in a viewer covering 95% of the screen. Choose Actual size to inspect fine details, and press Escape or Close to return to the page.

Tenant appearance

On plans that include the Appearance feature, a tenant administrator opens Tenant appearance in the dashboard sidebar (the page was previously called Branding; the old /branding address still works). This sets the default look of the tenant's dashboard and sign-in page for everyone.

  1. Under Theme, choose Default - Brutal, Classic Blue, Liquid or Phosphor.
  2. Optionally open Dashboard colors, expand Light mode or Dark mode, tick Customize … next to any color you want to change (for example Buttons and selected navigation or Text on buttons) and pick a color. Unticked colors keep following the theme. Use original {theme} colors clears every customization. Light and dark palettes are saved separately.
  3. Under Layout density, keep Comfortable (default) or choose Compact. Compact uses slightly smaller text and tighter spacing in the header, side menu, cards, tables and forms, so more rows and tiles fit on one screen. Nothing is hidden or moved; it is the same layout, closer together. The density applies to everyone in the tenant unless a user picks their own under My appearance; the sign-in page is unaffected.
  4. Click Save (the page confirms Appearance saved.). Reset to defaults restores Brutal, comfortable density and no customizations.

Keep text readable against its background, and keep the success, warning and error colors distinguishable. A child-organization administrator cannot open this page; it is tenant-administrator only, and on plans without the feature the dashboard reports Your plan does not enable appearance customization.

Tenant logo and favicon

The same page has a Tenant logo and favicon card. Custom images appear only on your tenant's own <slug>.app.certin.tel pages (and on your vanity domain, if set); the shared app.certin.tel sign-in page keeps the CertIntel identity, and personal themes never replace these images.

Image Requirements
Dashboard logo PNG, JPEG or WebP, at most 1 MB, 64–1600 pixels wide and 32–400 pixels high, aspect ratio between 2:1 and 8:1. Recommended: a transparent 640 × 160 PNG with a horizontal wordmark. Displayed within 160 × 40 pixels.
Favicon PNG, JPEG or WebP, at most 256 KB, square, 64 × 64 to 512 × 512 pixels. Saved as a 64 × 64 PNG. No SVG or animated images.

Uploading a new image replaces the existing one. Tick Remove current logo or Remove current favicon and click Save images to go back to the selected theme's own artwork.

Client co-branding (MSP mode)

Tenant appearance applies to the whole workspace. On plans with MSP (the Enterprise plan), a client organization can add its own name and logo next to it: Organizations → Co-branding on the client's row (workspace-wide branding.update). The client logo follows the same shape rules as the dashboard logo, but at most 256 KB, and is stored as PNG.

  • In the dashboard the client's name and logo appear beside the tenant's branding while the view is that organization only (selected in the top bar, or after switching into the client). The tenant theme, colors, logo and favicon stay as they are.
  • Emails and scheduled reports for that organization read for in their header, as text only; no logo is sent by email.
  • The sign-in page and the vanity domain keep the tenant's branding.

See MSP mode for the form, the Clients page and switching into a client.

Your own address (vanity domain)

On plans that include a workspace address (https://<slug>.app.certin.tel), a tenant administrator can also serve the same workspace at a hostname the organization owns, for example certintel.your-company.com. Open Security → Your own address (vanity domain), enter the hostname, click Add vanity domain, and create the two CNAME records the page then shows at your DNS provider (Re-check DNS & renew now repeats the check later):

Name Type Target Why
certintel.your-company.com CNAME your workspace address, <slug>.app.certin.tel. Sends visitors to this workspace. Point it at your workspace address exactly as shown, not at the shared sign-in address.
_acme-challenge.certintel.your-company.com CNAME the Delegated DNS-01 target shown on the page Lets CertIntel prove control of the name to the certificate authority, now and at every renewal. Leave it in place.

Then choose Check DNS & issue certificate. CertIntel verifies both records through public resolvers, obtains a certificate for exactly that hostname (no wildcard, no other names), renews it automatically before expiry, and keeps a still-valid certificate in service if a renewal fails. Records that propagate later are picked up by a periodic re-check, so you do not have to click again. Sign-in and the dashboard then work at both addresses, and the Security page's other controls (workspace-host-only sign-in, IP allowlists) treat the vanity domain exactly like your workspace address.

Notes:

  • One vanity hostname per tenant. Most DNS providers cannot place a CNAME at a bare domain (zone apex); use a subdomain such as certintel.<your-domain>.
  • With Cloudflare, set both records to DNS only (grey cloud), not proxied.
  • The Delegated DNS-01 record behind the vanity domain appears on the Delegated DNS-01 page but cannot be revoked or deleted while in use; remove the vanity domain first.
  • Remove vanity domain stops serving the certificate immediately. Changing the tenant slug invalidates the first CNAME until you update it.
  • The feature is enabled per deployment; if the card is not on the Security page, your CertIntel installation does not offer it.

My appearance (per user)

On the same plans, every signed-in user can pick their own look under You → My appearance in the sidebar. The preference is stored with the account, so it follows you across browsers and devices.

  • Theme: Use tenant default (follow whatever the administrator sets, including future changes) or one of the four themes. A personal theme also unlocks the same Dashboard colors editor for your own palette; the tenant's custom colors are then no longer used for you.
  • Color mode: Use system setting, Light or Dark. The light/dark button in the dashboard header saves to this setting as well.
  • Layout density: Use tenant default, Comfortable or Compact. Choosing Comfortable explicitly opts you out of a compact tenant; Compact gives you the denser layout even when the tenant is comfortable.
  • Save stores the choice; Reset to tenant default removes it.

Tenant logos and favicons are not affected by personal themes. On plans without the Appearance feature, and on the sign-in page, the header's light/dark button is remembered by a cookie in that browser only.

Time zone

CertIntel stores every timestamp in UTC and shows it in a time zone you choose, on every plan. It works the same way as the theme: the workspace has a default and each person can override it.

  • Workspace default: a tenant administrator sets Time zone in the Organization settings card of Settings → Security. New workspaces start on UTC. The change is written to the activity log.
  • Personal choice: anyone signed in opens You → My preferences and picks a zone, or Use workspace default to follow the administrator's setting (including future changes). The choice is stored with the account.

Every date and time on the dashboard follows the zone in effect: certificate validity, last-seen and next-check times, activity and job history, the page footer clock. Times carry the zone's abbreviation (EDT, CET, JST), and the Since / Until filters on the Activity Log and Background Jobs pages read the values you type in that zone. Alert messages and scheduled-report emails use the workspace default. Two things stay in UTC: the Hour (UTC) you pick when scheduling a report or backup, and API responses, which are ISO-8601 with an explicit offset.

Windows Agent theme

The Windows Agent follows the tenant theme and the tenant's customized button colors (the Buttons and selected navigation and Text on buttons colors of the matching light or dark palette) after it receives branding from the platform. This requires an install-token-enrolled agent that has been approved. An agent connected with an integration API key uses its local theme.

To choose a theme for one server, the server administrator opens Settings → Appearance, turns Tenant override on, then chooses a Visual theme. Platform check-ins will no longer change that server's theme. Turn Tenant override off to resume following the tenant; Refresh platform theme fetches the tenant's current theme immediately. The override applies to the server; the local visual theme and Color mode preferences are saved for the Windows user running the app. Light/dark mode remains independently selectable when following the tenant. Windows high-contrast colors take priority.

The appearance status explains whether the agent is following the tenant, using an override, waiting for approval, or unable to obtain branding. When branding is unavailable, the local theme is used until a successful check-in.

Brand assets

Official CertIntel logos, icons, and colors, mirrored here from the identity package in certintel-documentation (docs/product/brand/) so they're easy to download. The assets and palette below describe the default Brutal identity, which uses a cream canvas, near-black type and outlines, pink actions, and yellow and blue supporting accents, set in Space Grotesk and Space Mono.

All logo files are SVG with the lettering converted to outlines, so they render identically without any font installed. App icons and favicons also come as PNG. "Light" and "dark" in a file name describe the background the file is made for, not the color of the artwork.

Primary logos (mark + wordmark)

Horizontal - website headers, presentation titles, product signatures.

Preview File
CertIntel horizontal logo for light backgrounds logo-horizontal-light.svg
CertIntel horizontal logo for dark backgrounds logo-horizontal-dark.svg
certin.tel horizontal logo for light backgrounds logo-horizontal-certin-tel-light.svg
certin.tel horizontal logo for dark backgrounds logo-horizontal-certin-tel-dark.svg

Use the certin.tel versions when the domain is the intended identifier.

Stacked - square or narrow layouts.

Preview File
CertIntel stacked logo for light backgrounds logo-stacked-light.svg
CertIntel stacked logo for dark backgrounds logo-stacked-dark.svg

Wordmarks

For spaces where the full logo is too dense.

Preview File
CertIntel wordmark for light backgrounds wordmark-certintel-light.svg
CertIntel wordmark for dark backgrounds wordmark-certintel-dark.svg
certin.tel wordmark for light backgrounds wordmark-certin-tel-light.svg
certin.tel wordmark for dark backgrounds wordmark-certin-tel-dark.svg

Standalone mark

The shield and radar symbol on its own.

Preview File Use
Pink CertIntel mark mark-pink.svg Default mark on light backgrounds
Ink CertIntel mark mark-ink.svg Single-color use on light backgrounds
Cream CertIntel mark mark-cream.svg Dark backgrounds
White CertIntel mark mark-white.svg Dark or colored backgrounds

App icons

512×512 outlined tiles for PWA manifests, touch icons, and app listings. Pink is the default tile; the others are alternates for different surfaces.

Preview Tile Files
Pink app icon Pink (default) .svg · .png
Yellow app icon Yellow .svg · .png
Blue app icon Blue .svg · .png
White app icon White .svg · .png
Cream app icon Cream .svg · .png

Favicon

favicon.svg · favicon-32.png · favicon-16.png

The favicon uses heavier strokes than the marks above so it stays legible at 16px. It is this site's own browser tab icon.

Color palette

HSL values are canonical; hex values are rounded for SVGs and design tools.

Swatch Name HSL Hex Role
Cream hsl(44 100% 92%) #FFF4D6 Default page canvas
Ink hsl(0 0% 7%) #121212 Text, outlines, shadows, text on bright fills
Pink hsl(330 100% 68%) #FF5CAD Primary actions, selected controls
Yellow hsl(48 100% 60%) #FFD633 Callouts, labels, table headers
Blue hsl(222 100% 70%) #6694FF Information panels, supporting emphasis
Pale yellow hsl(48 100% 80%) #FFEB99 Header, footer, secondary surfaces
White hsl(0 0% 100%) #FFFFFF Cards and content panels
Lime hsl(90 90% 62%) #9EF547 Small positive-status accents

Keep cream as the dominant canvas and lime as an occasional accent. Put ink text on every bright fill. Bright pink is a fill or decoration, not a text color on cream or white - for links on light surfaces use the darker hsl(330 100% 34%) with an underline, as this site does. The accent colors don't replace warning or error colors.

Typography

Role Typeface
Wordmark, headings, interface Space Grotesk (bold for the wordmark and headings)
Small labels and metadata Space Mono
Long-form reading and code System sans-serif and monospace

Both typefaces are free under the SIL Open Font License. The logo files don't need them installed.

  • Keep clear space of at least one shield-width around the logo.
  • Minimum sizes: horizontal logo 160px wide, stacked logo 120px wide, and the mark 24px high. Below that, use the favicon.
  • Keep the logo level, unshadowed, in its supplied colors and proportions.
  • Use alt="CertIntel" on logo images, or empty alt text when the product name is already written next to the mark.

Source

These files are the canonical copy from certintel-documentation at docs/product/brand/. To change the identity or add a variant, change it there first and re-sync this folder.