T
TailNG

Playground

 Home tailng.com

tng-badge demo

Showcasing: value (number/string), max overflow, dot, hide, showZero, positions, overlap, variants, sizes, and class hooks.

Interactive controls

count=12, bigCount=128, zeroCount=0

Numbers + overflow (max)

Dot badge

showZero

String value + empty/null behavior

Toggle statusText above to null -> badge hides.

hide (force hide)

Positions

top-right
top-left
bottom-right
bottom-left

overlap: true vs false

overlap=true
overlap=false

Variants

primary
neutral
success
warning
danger
info

Sizes

sm
md
dot sm
dot md

Class hooks (badgeKlass / hostKlass / rootKlass)

Badge-only usage

Badge-only works if you provide a visible host via hostKlass.