The environment component, also known as env, displays a banner at the top of every page to clearly indicate when a user is viewing a non-production environment. 

The component helps prevent confusion by ensuring users always understand whether they are interacting with a development, staging or production service. 

The environment component is intentionally prominent. Its bright yellow background and position at the top of the page ensures that users do not mistake a testing environment for a live service. 

When to use this component

Use the environment component on any page that is not part of the live, production service.

This includes:

• Development environments
• Staging or pre-production environments
• User testing or prototype environments
• Internal demo environments

The purpose of the component is to ensure users — including developers, testers, content designers and stakeholders — immediately recognise that the page is not a live, public-facing system.

When not to use this component

Do not use the environment component in a production environment.

Example of where we have used this component

This component is used on:

• ASP website
• Assure
• Formation
• EBIT

This list is not exhaustive.

Status of development

The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.

Make a change to the Design System

Suggest an edit to this system, or any of the components in it, by submitting a Design System change request.