{{-- Clip path --}}

<svg width="0" height="0">
    <defs>
        {{-- Scale values are based on the width and height -> scale(1/width, 1/height) this is because we use the objectBoundingBox value in clipPathUnits --}}
        <clipPath id="clip-path-image-1" transform="scale({{1/240}}, {{1/178}})" clipPathUnits="objectBoundingBox">
            <path d="M221 169.7L239 9a8 8 0 00-7.1-8.9 7.6 7.6 0 00-1.4 0L7.5 13a8 8 0 00-7.5 8l.1 131a8 8 0 007.4 8l204.9 17a8 8 0 008.6-7.2z"/>
        </clipPath>

        <clipPath id="clip-path-image-2" transform="scale({{1/284}}, {{1/183}})" clipPathUnits="objectBoundingBox">
            <path d="M28.4 1.5L249 0a25 25 0 0114.8 4.5 20.8 20.8 0 018.7 15c2 17 11 116 11 116s5.6 30.6-21 33c-5.5.5-238 14-238 14s-20.2.4-24-17.2A25 25 0 010 159L6.3 26.5A30 30 0 019.6 14c3-5.6 8.5-11.6 18.8-12.4z"/>
        </clipPath>

        <clipPath id="clip-path-image-3" transform="scale({{1/479}}, {{1/352}})" clipPathUnits="objectBoundingBox">
            <path d="M37.8526 344.755L0.0509148 8.89477C-0.44325 4.50421 2.7154 0.544369 7.10596 0.0501979C7.5547 -0.0003087 8.00692 -0.0127294 8.45776 0.013058L471.44 26.5065C475.677 26.749 478.987 30.2577 478.983 34.5015L478.705 308.847C478.701 313.008 475.509 316.47 471.362 316.812L46.4595 351.833C42.1488 352.189 38.3364 349.053 37.8526 344.755Z" />
        </clipPath>


        {{-- Here we can add other clipPath elements --}}
    </defs>
</svg>