• Material
  • Fabric
  • Bootstrap
  • High Contrast
Preferences
Theme Selection
Mode Selection
Touch
Mouse
Essential JS 2
HOME
All Controls

Button

This sample demonstrates the integration of avatar component with badges to create notification avatars.

DEMO
SOURCE
profile_pic
6
profile_pic
12
profile_pic
46
profile_pic
82
profile_pic
99+
profile_pic
6
profile_pic
12
profile_pic
46
profile_pic
82
profile_pic
99+

The avatar can be used with badges to indicate the new activities to users. The container needs position: relative property to achieve the notifications styled avatar. In this sample, the wrapper is applied with position: relative property with avatar and badge elements inside it.

Since the avatar is a supportive and dependent component, it can be used in many ways and have wide variety of use-cases.