Badge

Labels, counts and status.

Default

Neutral Success Warning Danger Info

<span class="<%= badge_class(tone: :neutral) %>">Neutral</span>
<span class="<%= badge_class(tone: :success) %>">Success</span>
<span class="<%= badge_class(tone: :warning) %>">Warning</span>
<span class="<%= badge_class(tone: :danger) %>">Danger</span>
<span class="<%= badge_class(tone: :info) %>">Info</span>

Example 2

Accent Danger

<span class="<%= status_pill_class(tone: :accent) %>">Accent</span>
<span class="<%= status_pill_class(tone: :danger) %>">Danger</span>

Example 3

Eyebrow

<p class="<%= eyebrow_class %>">Eyebrow</p>

API reference

eyebrow_class

eyebrow_class(extra: nil)

Parameter	Default	Values
extra	nil	Additional Tailwind classes

badge_class

badge_class(tone: :neutral, extra: nil)

Parameter	Default	Values
tone	:neutral	:neutral · :success · :warning · :danger · :info
extra	nil	Additional Tailwind classes

status_pill_class

status_pill_class(tone: :accent, extra: nil)

Parameter	Default	Values
tone	:accent	:accent · :danger
extra	nil	Additional Tailwind classes