Image Stack Group (Divi)

Overlapping avatars, logos, icons or initials for Divi 5 — the social-proof row under a hero, a team, a client list. Each one is an Item child module with its own tooltip, link and colours. No JavaScript: the overlap is a negative margin and the tooltips are CSS. Hover or tab through them.

1. Social proof

Five photos with name tooltips · Add to the Count 2,400 → a “+2.4k” bubble · caption beside the group with a 4.5-star rating and bold text · Lift and bring to front on hover · first item on top · centred. On phones the caption moves below.

2. Shapes and hover effects

Rounded squares that Grow · Squares that Spread apart (12 px) · circles that Dim the others · initials with their own background colours, last item on top, tooltips below.

3. Icons, a limit and links

Left: Font Awesome icons from the Divi icon picker, 28 px in 64 px circles, violet on lavender, a gap between them (overlap −8 px) and tooltips to the right. Right: eight team members with Show at Most 4 — the other four become “+4”, which links to #team — each face links to its own page, and the caption sits below.

4. Finished design

A dark hero row: 80 px faces with a 4 px navy border that turns amber on hover, a soft shadow, a “+12k” bubble in amber, a 5-star rating in amber over a 20 px white caption with pink bold text, custom tooltips (amber, dark text, 8 px radius), 20 px from the group. 52 px on phones.