<div class="avatar-grid avatar-grid--items-4">
    <img class="avatar-grid__item" alt="0" src="//placeponi.es/100/100/2">
    <img class="avatar-grid__item" alt="1" src="//placeponi.es/100/100/3">
    <img class="avatar-grid__item" alt="2" src="//placeponi.es/100/100/4">
    <img class="avatar-grid__item" alt="3" src="//placeponi.es/100/100/5">
<div class="avatar-grid avatar-grid--items-{{ avatars.length }}">
    {{#each avatars}}
    <img class="avatar-grid__item" alt="{{ @key }}" src="{{ this }}">
  "avatars": [

Takes between one and four images.

For one and four images, the layout uses square images. For two images, both images are cropped to 1:2 ratio. For three images, the first image is cropped to 2:1 ratio while the others remain square.