Problem with the service (500) - GovBB Design System

On this page

Show this page for an unhandled server error and return the 500 status code. Reassure the user it is not their fault, tell them it is being dealt with, and give them ways forward rather than a dead end.

Preview

Something went wrong on our end

Open in new tab

<div class="govbb-official-banner">
  <div class="govbb-width-container govbb-official-banner__inner">
    <div class="govbb-official-banner__crest">
      <img
        class="govbb-official-banner__icon"
        src="/assets/images/govbb-crest.svg"
        alt=""
      />
    </div>
    <div class="govbb-official-banner__text">
      <span>Official government website</span>
      <a
        class="govbb-official-banner__link"
        href="/government/website-information/"
      >
        Learn more
      </a>
    </div>
  </div>
</div>
<header class="govbb-header">
  <div class="govbb-width-container govbb-header__inner">
    <a href="/">
      <img
        class="govbb-header__logo"
        src="/assets/images/govbb-logo.svg"
        alt="gov.bb"
      />
    </a>
  </div>
</header>
<main class="govbb-width-container govbb-main-wrapper" id="main-content">
  <h1 class="govbb-text-h1">Something went wrong on our end</h1>
  <p class="govbb-text-body">
    We're experiencing a technical problem. This isn't your fault.
  </p>
  <p class="govbb-text-body">
    Our team has been notified and is working to fix it.
  </p>

  <h2 class="govbb-text-h3">Suggestions:</h2>
  <ul class="govbb-list govbb-list--bullet">
    <li>Refresh the page and try again</li>
    <li>Return to the homepage</li>
    <li>Try again in a few minutes</li>
    <li>Contact us if the problem continues</li>
  </ul>

  <div class="govbb-button-group">
    <a class="govbb-button govbb-button--secondary" href="/contact/"
      >Contact us</a
    >
    <a class="govbb-button" href="/">Return to homepage</a>
  </div>
</main>
<footer class="govbb-footer">
  <div class="govbb-width-container govbb-footer__inner">
    <nav class="govbb-footer__nav" aria-label="Footer navigation">
      <ul class="govbb-footer__list">
        <li class="govbb-footer__item">
          <a class="govbb-link govbb-footer__link" href="/">Home</a>
        </li>
        <li class="govbb-footer__item">
          <a class="govbb-link govbb-footer__link" href="/cookies">
            Cookie policy
          </a>
        </li>
        <li class="govbb-footer__item">
          <a class="govbb-link govbb-footer__link" href="/terms">
            Terms &amp; conditions
          </a>
        </li>
        <li class="govbb-footer__item">
          <a class="govbb-link govbb-footer__link" href="/sitemap">Sitemap</a>
        </li>
      </ul>
    </nav>
    <hr class="govbb-footer__divider" aria-hidden="true" />
    <div class="govbb-footer__end">
      <img
        class="govbb-footer__coat"
        src="/assets/images/govbb-crest.svg"
        alt=""
      />
      <p class="govbb-footer__copy">© 2026 Government of Barbados</p>
    </div>
  </div>
</footer>

When to use this page

Use it for errors the user cannot do anything about - a failed dependency, an exception, a timeout. For planned downtime use the service unavailable page instead.

What to include

Say something went wrong, that the team is aware, and offer next steps. Never show error details, stack traces or internal identifiers.