PnP Modern Search - custom Refiner showing file icons

The Out of the box Refiner might look a bit dull when showing the various values, in this case File Extensions:

However, nothing prevents you from adding some visual guides to the end users, in this case some icons.

pnp-iconfile makes it super easy :-)

{{#eq filter.filterName 'FileExtension'}}		
<div>
	<pnp-iconfile data-extension="{{name}}" data-is-container="false" 		 data-size="32"></pnp-iconfile>
</div>

{{/eq}}

As usually you can find this custom layout on PnP Modern Search Layouts,

pnp-modern-search-layouts/Refiner/File Extensions icons at main · microsoft-search/pnp-modern-search-layouts (github.com)