has been released! Read the upgrade guide

Dismissible Banner

The documentation on this page is considered legacy.

We will be updating this content to our new principle-based format in the near future.


The Dismissible Banner is a temporary banner that sits at the top of the page.


The primary usage for the Dismissible Banner is to provide context and information to users, particularly for first time visitors. Once dismissed, it should remain hidden until its contents has been updated.


3Sizing & Spacing

This component comes in one size only. It can resize to the width of its parent, however the component's height is dictated by its contents.

4Hierarchy & Placement

The Dismissible Banner should be placed at the top of the page content to ensure it is the first thing the user interacts with.

The MOD.UK Design System provides guidance and tools for building high–quality Services within the UK Ministry of Defence. This project is open source and its source code is available on GitHub.

All content is available under the Apache 2.0 licence, except where otherwise stated.

© Crown copyright