Sections

Bling

Bling is used to indicate award type in badges, topbar, and user cards.

Types

Use bling to indicate the type of award.

<span class="s-bling s-bling__gold">…</span>
<span class="s-bling s-bling__silver">…</span>
<span class="s-bling s-bling__bronze">…</span>

Example	Class	Description
default bling	`.s-bling`	A “default” bling.
rep bling	`.s-bling` `.s-bling__rep`	A “rep” bling.
activity bling	`.s-bling` `.s-bling__activity`	A “activity” bling.
gold bling	`.s-bling` `.s-bling__gold`	A “gold” bling.
silver bling	`.s-bling` `.s-bling__silver`	A “silver” bling.
bronze bling	`.s-bling` `.s-bling__bronze`	A “bronze” bling.

Filled

Section titled Filled

Use filled version of the bling.

<span class="s-bling s-bling__filled s-bling__gold">…</span>
<span class="s-bling s-bling__filled s-bling__silver">…</span>
<span class="s-bling s-bling__filled s-bling__bronze">…</span>

Example	Class	Description
default bling	`.s-bling`	A “default” bling.
rep bling	`.s-bling` `.s-bling__rep`	A “rep” bling.
activity bling	`.s-bling` `.s-bling__activity`	A “activity” bling.
gold bling	`.s-bling` `.s-bling__gold`	A “gold” bling.
silver bling	`.s-bling` `.s-bling__silver`	A “silver” bling.
bronze bling	`.s-bling` `.s-bling__bronze`	A “bronze” bling.

Sizes

Section titled Sizes

Use different sizes of the bling.

<span class="s-bling s-bling__filled s-bling__gold s-bling__sm">…</span>
<span class="s-bling s-bling__filled s-bling__gold">…</span>
<span class="s-bling s-bling__filled s-bling__gold s-bling__lg">…</span>

Example	Class	Description
sm bling	`.s-bling` `.s-bling__sm`	A “sm” bling.
default bling	`.s-bling`	A “default” bling.
lg bling	`.s-bling` `.s-bling__lg`	A “lg” bling.