A group of avatar with avatar-group . They can be hovered/focused.


Add avatar-badge with optional colors.


What about a dark background ?


Soft colors allow same style colors

  • Use bg-soft modifier to use transparency on any bg-* (may work better with dark mode).
  • Use bg-softy modifier to use transparency on any bg-* (but avoid transparency issue by using a white/black background).
  • Position badges with avatar-badge-*
  • Pad text properly in badges with avatar-badge-text

Using -subtle styles. You need to use text-* as well

Using bg-soft(y) modifier (and you get hover behaviour as a bonus :-) )


They should all have white icons and proper contrast. Primary and info should not look too much alike.


User grid

MM

Martin Macho

Blitz developer

JJ

Jose Jano

Funky developer

RR

Roger Rango

Rocks developer