> For the complete documentation index, see [llms.txt](https://story.groupthought.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://story.groupthought.com/collections/collection-pages/savings-badge.md).

# Savings badge

Display a dynamic savings value or percent styled badge on collection pages

Story theme includes a discount or savings value badge that can display how much the customer is saving by the amount or by percentage.

Example of Savings badge with percent-off value automatically calculated:

![Percent off is calculated from price and compare at price](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FNoBwTPTCgnw0K0XZ9muJ%2FScreen%20Shot%202021-12-29%20at%2012.04.16%20PM.png?alt=media\&token=3e30b97b-5f1d-4812-866a-597bab8d19c1)

Optionally, you can display the amount saved on the sale item:

![Amount off is calculated from price and compare at price](https://798529998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Frse2xho0gVJCQ27Qc08u%2Fuploads%2FlWtmZEfzHSamCQYylf8O%2FScreen%20Shot%202021-12-29%20at%2012.03.58%20PM.png?alt=media\&token=26edc26a-65a7-477a-a4c4-e4b4c9236723)