Start your 7-day free trial, card not charged until it ends
Browse all topics

Brand consistency monitoring

Brand, compliance, accessibility & SEO · Last updated 16 July 2026

Your brand is only as consistent as your least-watched page. A designer ships a new landing page, an agency updates a template, a plugin restyles a button, and slowly the site drifts off the colours, fonts and shapes you agreed. Brand consistency scores each page against a brand kit you define, gives it an on-brand score out of 100, and alerts you when a page drifts.

What it is

An automated check that captures a page, reads the fonts, colours, spacing, shapes and logo it actually uses, and compares them against a brand kit you set up (your approved fonts, your palette, your spacing scale and logo rules). It returns an on-brand score from 0 to 100 and a status of OK, Warning or Fail.
Read more
The check does not eyeball a screenshot and guess. It captures the page's real computed styles (the exact fonts and hex colours the browser rendered) and scores each dimension deterministically: what proportion of the fonts, colours and spacing on the page match your approved set. A vision pass then adds judgement on the softer dimensions such as logo placement and imagery. The main dimensions can be weighted or switched off, and colours and spacing given a tolerance, so the score reflects what your brand actually cares about.

Why it matters

On a growing site, brand drift is invisible until a customer or a boss notices. A stray off-palette colour, the wrong font on one template, three different button styles: none of them break the site, but together they make it look cheaper and less trustworthy. This catches the drift while it is one page, not a rebrand.
Read more
Design systems exist precisely because humans cannot police consistency by hand across dozens of pages and templates. The moment more than one person can publish, drift is inevitable. An automated scorer that runs on a schedule turns "someone should check the site looks right" into a number you can watch, and an alert you get when it slips.

What a brand kit contains

A brand kit is your rulebook. You create one per brand (an agency can hold many, one per client) and assign it to the domains it governs. A kit holds:

  • Approved fonts. The font families your brand uses, for example Inter and Bricolage Grotesque. Anything else rendered on the page counts against the font score. Generic fallbacks such as sans-serif or system-ui are never penalised.
  • Approved colours. Your palette as hex values. The check measures how far each colour actually used on the page sits from the nearest approved colour, so a near-miss shade is caught, not just an exact clash.
  • A spacing scale. The pixel steps your layout should snap to (for example 4, 8, 16, 24, 32). Spacing that lands off the scale, beyond a leeway you set, is flagged.
  • Logo usage notes. Written rules about how your logo should and should not be used. Logo presence and placement are judged by the vision pass.
  • Imagery guidance. A plain-language description of the photographic or illustration style your brand expects.
  • Learned baselines (optional). If you point the kit at your own site with Learn from your main site, it captures that site's corner radii, button variety and image spacing rhythm, and scores other pages relative to those, rather than against an absolute ideal.

Three fast ways to fill a kit

You do not have to type every value by hand. Learn from your main site (the Capture button) captures your live site and drafts a palette, fonts and spacing from it. Import PDF reads an existing brand-guidelines document and extracts the rules with AI. Or fill the form in manually. Whichever you use, you can edit everything afterwards.

The dimensions it scores

Each page is scored on several dimensions, and you control which ones count and how much:

  • Fonts. The share of on-page text set in an approved family. Off-brand families are listed as violations with how much of the page used them.
  • Colours. The share of used colours that fall within tolerance of your palette. Trivially rare colours (a single icon, anti-aliased edges) are ignored so a stray pixel never sinks the score.
  • Spacing. How closely the page's spacing values match your scale, within the leeway you set.
  • Typography hierarchy. Whether headings descend in size sensibly (H1 at least as large as H2, H2 at least as large as H3, body smallest).
  • Shapes. Corner radii and button-style variety, compared against your learned baseline. Introducing new radii or extra button styles is flagged.
  • Image spacing. Whether images sit on the same spacing rhythm your brand was learned with.
  • Logo and imagery. Judged by the vision pass against your usage notes and imagery guidance. Imagery is switched off by default.

Fonts, colours, spacing, logo and imagery can each be switched on or off and given a weight of high, medium or low. Colours have a tolerance percentage (8% by default) and spacing a pixel leeway (4px by default). Typography hierarchy, shapes and image spacing always count, at fixed weights. The individual scores are then blended by weight into a single 0 to 100 figure.

What the score and status mean

The blended score maps to a status using two thresholds you can adjust:

  • OK (shown as On brand) when the score is at or above the warning threshold (85 by default). The page is on-brand.
  • Warning (shown as Needs attention) when the score is below the warning threshold but at or above the fail threshold. Some drift worth a look.
  • Fail (shown as Off brand) when the score is below the fail threshold (70 by default). The page is meaningfully off-brand.

Every check also lists the specific violations behind the number: which font was found where it should not be, which colour is off-palette and what it is closest to, which spacing values missed the scale. So a low score always comes with a to-do list, not just a verdict.

What you need before you start

  • A monitored website to assign the kit to. Brand kits attach to your sites. Add the site first if you have not (see Add your first website). Only monitored domains appear in the assign picker.
  • Your brand details, or a source to learn them from. Either your fonts, hex colours and spacing to type in, a live URL to Learn from, or a brand-guidelines PDF to import.
  • Visual-check credits. Brand checks draw on the same monthly visual allowance as visual monitoring (150 a month on Starter, 600 on Pro, 2,000 on Agency). Each page checked uses one. Visual credits are not sold in packs.

How a check runs

When a check runs, TLDTrack loads the page in a real browser on our infrastructure, records its computed styles into a profile, and scores that profile against the assigned kit. The homepage is always checked; you can add extra paths to check alongside it. Results appear within a minute or two, each with its score, status, the underlying violations and a screenshot of exactly what was captured.

You can run a check on demand, or set the kit to a schedule so it runs by itself. The scheduled options are daily, weekly or monthly (or manual, meaning on-demand only). A schedule is a property of the kit, so it applies to every domain that kit is assigned to.

How alerting works

Brand checks do not nag you every time they run. An alert fires when a page's status worsens: from OK to Warning or Fail, or from Warning to Fail. The first check of a page also alerts if it comes back Warning or Fail. This is the brand_drift alert type.

  • A drop to Fail raises a critical alert; a drop to Warning raises a warning alert.
  • The alert names the kit and the score, for example "On-brand score dropped to 62/100 (Fail)", and goes to your notification contacts.
  • A page that stays at the same status, or improves, does not alert, so you are told about drift, not reminded that a page is fine.

How to set it up, step by step

  1. 1
    Open Brand Consistency from your dashboard and choose New brand. Give it a clear name, for example the client or brand it belongs to.
  2. 2
    Fill in the kit: type your fonts, colours and spacing, or use Capture under Learn from your main site to draft them from your live site, or Import PDF to pull them from a brand-guidelines document. Add your logo usage notes and imagery guidance.
  3. 3
    Tune the sensitivity if you want: switch dimensions on or off, set their weight, and adjust the colour tolerance, spacing leeway and the fail/warning score thresholds.
  4. 4
    Assign the kit to the domains it governs by picking them in the editor, or later from a site's Brand Consistency tab.
  5. 5
    On a site's Brand Consistency tab you can also add extra paths to check beyond the homepage, for example /pricing or /about.
  6. 6
    Choose a schedule for the kit (daily, weekly, monthly, or manual) and save.
  7. 7
    Run a check now to see the first score, or wait for the schedule. Each result shows the score, the violations and a screenshot.

Assign monitored sites, then focus the paths

You do not need to check every page of a site. Assign the kit to the sites that carry the brand, then add just the handful of high-traffic pages as extra paths. That keeps each run cheap in visual credits and keeps the alerts about the pages customers actually see.

Where to set this up

Good to know

  • Brand checks share the monthly visual-check allowance with visual monitoring, not the security-scan pool. Each page checked uses one visual credit.
  • The homepage is always included; extra paths are optional per domain.
  • Shape and image-spacing scoring only switch on once you have run Learn to capture a baseline. Until then they stay dormant and never drag the score.
  • Generic font fallbacks and one-off rare colours are deliberately ignored, so the score reflects real drift, not noise.
  • A schedule belongs to the kit, so changing it affects every domain that kit is assigned to.
Available on:StarterProAgency

Was this guide helpful?

If anything is unclear or missing, tell us and we will improve it.

Contact support