hinode/content/en/docs/0.8/components/badge.md

author, title, date, description, group, layout

author	title	date	description	group	layout
Mark Dumay	Badge	2023-01-11	Use the badge to enrich headings and buttons.	components	docs

Overview

Badges can be added to headings and buttons. The badge for a button is part of a [custom shortcode]({{< ref "button" >}} "custom shortcode"). The example below illustrates the HTML code for a heading.

Arguments

N/A

Example

Use HTML code to display a badge for a heading. See the Bootstrap [documentation]({{< param "links.bs_badge_heading" >}}) for more options. The following example displays a badge for a heading of size four.

<h6>Example heading of size four <span class="badge bg-secondary">New</span></h6>

The result looks like this.

Example heading of size four New