---
title: "Headline Price"
canonical: https://sky-ui.cf.sky.com/components/headline-price
---

# Headline Price

Shows key pricing information in a headline format.

## Purpose

The Headline Price component is used to show key pricing information in a headline format. It can be used to show if there is an active discount, if a price range starts from a certain amount, or if the price is for a set time period (e.g. an amount per month).

For pricing information in a inline format please see [Price](/components/price).

## Anatomy

The Headline Price component can be broken down into the following elements -

## Variants & States

- Appearance: Default, Light
- Alignment: Stacked, Inline
- Discount: on/off
- Prefix: on/off
- Decimals: on/off
- Suffix: on/off
- Disclaimer: on/off