---
title: "Popover"
canonical: https://sky-ui.cf.sky.com/components/popover
---

# Popover

The Popover displays supplementary content on top of another.

## Purpose

The Popover is a user-activated overlay to show contextual information. It is only used for supplementary content that isn’t essential to most users, yet relevant to the journey.

It should only be used where necessary because it’s more user-friendly to have content visible rather than hidden behind an interaction.

## Anatomy

The Popover component can be broken down into the following elements -

1. **Popover container**<br/>Container in speech bubble shape to hold the Popover information.

2. **Content area**<br/>Text area for the Popover information.

## Variants & States

Alignment: Left, Centre, Right

**Beak left-aligned**
  
**Beak centre-aligned**
  
**Beak right-aligned**