<div class="grid">
    <figure class="item" style="background: red;">
      <figcaption>
        <pre class="title" title="Colour name">red</pre>
        <pre class="subtitle" title="Hex code">#FF0000</pre>
      </figcaption>
    </figure>
    <figure class="item" style="background: green;">
      <figcaption>
        <pre class="title" title="Colour name">green</pre>
        <pre class="subtitle" title="Hex code">#00FF00</pre>
      </figcaption>
    </figure>
    <figure class="item" style="background: blue;">
      <figcaption>
        <pre class="title" title="Colour name">blue</pre>
        <pre class="subtitle" title="Hex code">#0000FF</pre>
      </figcaption>
    </figure>
    <figure class="item">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 240"><path d="M64,142.1a12.7,12.7,0,0,0-1.8-6.9,17.2,17.2,0,0,0-4.9-4.8,30.3,30.3,0,0,0-6.5-3.2c-2.3-.9-4.6-1.6-6.8-2.3s-6.3-2.3-9.6-3.7a46.5,46.5,0,0,1-8.9-5.3,27.3,27.3,0,0,1-6.6-7.4,19.4,19.4,0,0,1-2.5-10.1,20.7,20.7,0,0,1,2.5-10.3,23.6,23.6,0,0,1,6.7-7.7,30.4,30.4,0,0,1,9.3-4.8A34.9,34.9,0,0,1,45.5,74a32.5,32.5,0,0,1,11.2,1.9,30.4,30.4,0,0,1,9.6,5.5A25.6,25.6,0,0,1,73,89.9,25.3,25.3,0,0,1,75.7,101H64a28.7,28.7,0,0,0-1.9-7,16.9,16.9,0,0,0-3.8-5.5A15.2,15.2,0,0,0,52.7,85a18.1,18.1,0,0,0-7.2-1.3,23,23,0,0,0-6.4.9,16.8,16.8,0,0,0-5.5,2.8,13.4,13.4,0,0,0-5.4,10.8,11.7,11.7,0,0,0,2,6.6,17.2,17.2,0,0,0,4.8,4.5,34.4,34.4,0,0,0,6.4,3.1l6.4,2.1,6.7,2.4a64.4,64.4,0,0,1,6.5,3,50.2,50.2,0,0,1,5.9,3.9,27.3,27.3,0,0,1,4.7,4.9,24.6,24.6,0,0,1,3.2,6,24.3,24.3,0,0,1,1.1,7.3,20,20,0,0,1-2.7,10.5,24.8,24.8,0,0,1-6.9,7.5,30.3,30.3,0,0,1-9.6,4.5A39.5,39.5,0,0,1,46,166a38.6,38.6,0,0,1-11.7-1.8,33.2,33.2,0,0,1-10.2-5.4,28.4,28.4,0,0,1-7.4-8.4,24.3,24.3,0,0,1-3-11.5H25.3a24.4,24.4,0,0,0,2.3,7.5,18,18,0,0,0,4.5,5.4,17,17,0,0,0,6.2,3.4,23.9,23.9,0,0,0,7.7,1.1,24.8,24.8,0,0,0,6.6-.8,16.4,16.4,0,0,0,5.7-2.6,12.4,12.4,0,0,0,4.1-4.4A11.9,11.9,0,0,0,64,142.1Z"/><path d="M119.6,146.4l21.1-71.2h12.1l-28.2,89.6h-9.9L86.4,75.2H98.6Z"/><path d="M226.3,153a36.1,36.1,0,0,1-13,9.9,40.2,40.2,0,0,1-16.1,3.1,30.1,30.1,0,0,1-10.1-1.7,30.8,30.8,0,0,1-8.4-4.5,31.4,31.4,0,0,1-6.4-6.7,43.1,43.1,0,0,1-4.7-8.4,49.6,49.6,0,0,1-2.8-9.5,55.6,55.6,0,0,1-1-10V114.8a55.2,55.2,0,0,1,.9-9.9,49.1,49.1,0,0,1,2.5-9.5,48.4,48.4,0,0,1,4.3-8.5,30.5,30.5,0,0,1,6.2-6.7,28.3,28.3,0,0,1,8.2-4.5A27.3,27.3,0,0,1,196.1,74a32.7,32.7,0,0,1,11.5,1.9,28.2,28.2,0,0,1,9.3,5.6,28.5,28.5,0,0,1,6.3,8.6,34.2,34.2,0,0,1,3,11.4H214.9a31.8,31.8,0,0,0-2.1-7.2,18.2,18.2,0,0,0-3.7-5.6,16.2,16.2,0,0,0-5.5-3.7,21,21,0,0,0-7.5-1.3,18.1,18.1,0,0,0-7.2,1.4,18.5,18.5,0,0,0-5.4,3.7,19.6,19.6,0,0,0-3.9,5.5,33.7,33.7,0,0,0-2.5,6.5,33.4,33.4,0,0,0-1.4,7,56,56,0,0,0-.5,6.9v10.5c.1,2.3.3,4.6.6,7a56.2,56.2,0,0,0,1.6,7.1,41.7,41.7,0,0,0,2.9,6.5,24.1,24.1,0,0,0,4.1,5.4,18.7,18.7,0,0,0,5.7,3.7,18.1,18.1,0,0,0,7.2,1.4,40.5,40.5,0,0,0,4.9-.1,25,25,0,0,0,4.9-1,22.8,22.8,0,0,0,4.5-2,12.3,12.3,0,0,0,3.5-3.3l.2-20.1H197.1v-9.6h29Z"/></svg>
      <figcaption>
        <pre class="title" title="Icon name">svg</pre>
        <pre class="subtitle" title="Category name">other</pre>
      </figcaption>
    </figure>
</div>