Ready
Counter
Counters contain dynamic number values. Counters help users quickly identify quantities of non-visible items.
Details
Default
Light
Dark
With Border
Best Practices
1
.
Numbers
Counters should only contain numbers.
Do
Use only numeric values
Don't
Use to indicate other information
2
.
Usage
Counters should have a clear connection to the non-visible items they represent.
Do
Position Counters within correct context
Don't
Seperate the Counter from associated entity
More
Additional Reading
Indicators, Validations, and Notifications: Pick the Correct Communication Option https://www.nngroup.com/articles/indicators-validations-notifications/