Skip to main content

Customize status-page colors

Choose accessible primary, accent, background, and card colors for a verified public status page.

Color settings let a verified public status page better match your brand without changing the meaning of uptime results.

Change the page colors

  1. Open the monitor's Public Status Page settings.
  2. Complete ownership verification if the Branding tab is locked.
  3. Open Branding.
  4. Choose the colors under Style.
  5. Select Save branding and style.

The available controls are:

Setting Where it appears Default
Primary color Brand atmosphere, page glow, and primary actions #22c55e
Accent color Links, response-time bars, and keyboard focus accents #2563eb
Background color Main page background #f8fafc
Card color Hero and content-card surfaces #ffffff

The public page accepts six-digit hexadecimal colors. The visual color inputs provide a valid value automatically.

Preserve status meaning

Up, Down, and Paused indicators retain their established green, red, and amber semantic colors. Brand color settings do not let a page owner make a failed status appear healthy.

Choose an accessible combination

  • Keep strong contrast between the page background and cards.
  • Use an accent color that remains visible as link text on the card color.
  • Avoid very pale accent colors that make response bars or focus indicators difficult to see.
  • Check the page on both bright and dim displays.
  • Test keyboard focus, links, charts, and the external-link confirmation dialog.

Uptime Basics sanitizes color values but does not replace your visual accessibility review. View the public page after saving and adjust combinations that reduce readability.

If a color does not appear

  • Confirm ownership is Verified and the controls are unlocked.
  • Select Save branding and style after changing a color.
  • Refresh the public page after the save completes.
  • Check whether the element uses a fixed status color rather than a brand color.

Related articles

Did this answer your question?

Your response helps improve this Help Center.