CodePen

HTML

            
              <svg class="template" viewBox="0 0 10.404 10.403">
    <g id="icon">
        <path class="piece-1" d="M7.006,3.355l0.871,0.126L7.415,2.4H6.449l0.128,0.258C6.756,2.876,6.905,3.106,7.006,3.355z"/>
        <path class="piece-2" d="M0.351,3.798l0.782-0.114l0.912-2.115c0.041-0.104,0.117-0.192,0.228-0.263C2.383,1.235,2.492,1.2,2.602,1.2h1.946
          l0.348-0.703C4.975,0.326,5.077,0.24,5.202,0.24s0.227,0.086,0.307,0.257L5.856,1.2h1.56C7.042,0.85,6.612,0.56,6.111,0.347
          C5.567,0.115,4.998,0,4.401,0c-0.596,0-1.166,0.115-1.71,0.347S1.679,0.891,1.285,1.284C0.891,1.679,0.578,2.147,0.347,2.691
          C0.169,3.111,0.081,3.551,0.04,4.001C0.081,3.902,0.17,3.827,0.351,3.798z"/>
        <path class="piece-3" d="M0.557,5.021l0.075-0.173L0.156,4.386c-0.074-0.079-0.111-0.15-0.133-0.217C0.019,4.248,0,4.322,0,4.401
          c0,0.596,0.116,1.166,0.347,1.71c0.015,0.036,0.038,0.065,0.054,0.1V5.789C0.4,5.531,0.452,5.274,0.557,5.021z"/>
        <path class="piece-4" d="M9.993,8.86C9.98,8.943,9.949,9.019,9.885,9.084C9.806,9.163,9.712,9.204,9.604,9.204H8.42l0.071,0.415l0.55,0.548
          c0.15,0.158,0.338,0.236,0.562,0.236c0.217,0,0.404-0.078,0.562-0.236c0.159-0.158,0.238-0.346,0.238-0.562
          c0-0.223-0.077-0.41-0.231-0.564L9.993,8.86z"/>
        <path class="piece-5" fill="#FFB100" d="M6.327,9.204l1.683,0.885c0.087,0.049,0.171,0.074,0.25,0.074c0.083,0,0.146-0.029,0.19-0.09
          S8.516,9.938,8.516,9.85c0-0.055-0.002-0.096-0.006-0.125L8.491,9.619L8.075,9.204H6.327z"/>
        <path class="piece-6" fill="#FFB100" d="M1.895,9.725c-0.009,0.059-0.013,0.1-0.013,0.125c0,0.088,0.022,0.162,0.065,0.223
          c0.044,0.061,0.109,0.09,0.197,0.09c0.075,0,0.158-0.025,0.25-0.074l1.682-0.885H1.984L1.895,9.725z"/>
        <path class="piece-7" fill="#FFB100" d="M10.241,4.386c0.108-0.108,0.163-0.208,0.163-0.3c0-0.154-0.117-0.25-0.351-0.288L9.271,3.684l0.5,1.16
          L10.241,4.386z"/>
        <path class="piece-8" fill="#FFB100" d="M0,4.086c0,0.026,0.014,0.055,0.023,0.083C0.026,4.112,0.035,4.057,0.04,4.001C0.028,4.03,0,4.051,0,4.086z
          "/>
        <path class="piece-9" fill="#FFB100" d="M8.772,5.602c-0.005-0.013-0.01-0.029-0.016-0.05C8.75,5.531,8.745,5.515,8.741,5.502L8.687,5.375
          C8.67,5.45,8.656,5.527,8.635,5.602H8.772z"/>
        <path class="piece-10" fill="#FFB100" d="M7.006,3.355L6.915,3.342L6.577,2.659C6.513,2.58,6.456,2.498,6.381,2.423
          C6.372,2.415,6.362,2.409,6.354,2.4H3.955L3.489,3.342l-0.963,0.14L1.752,5.293c0.035,0.105,0.075,0.208,0.124,0.308h1.732
          l0.595,1.2h1.632c0.191-0.117,0.376-0.252,0.546-0.422c0.028-0.028,0.048-0.061,0.075-0.09l0.341-0.688h0.132
          c0.176-0.365,0.274-0.763,0.274-1.2C7.203,4.026,7.136,3.678,7.006,3.355z"/>
        <path class="piece-11" fill="#FFB100" d="M6.381,2.423C6.456,2.498,6.513,2.58,6.577,2.659L6.449,2.4H6.354C6.362,2.409,6.372,2.415,6.381,2.423z"/>
        <polygon class="piece-1" fill="#FFB100" points="8.075,9.204 8.491,9.619 8.42,9.204 	"/>
        <path class="piece-12" fill="#FFB100" d="M5.509,0.497C5.429,0.326,5.327,0.24,5.202,0.24S4.975,0.326,4.896,0.497L4.548,1.2h1.309L5.509,0.497z"/>
        <path class="piece-13" fill="#FFB100" d="M5.834,6.801h0.368L6.456,6.29c-0.027,0.029-0.047,0.062-0.075,0.09C6.211,6.549,6.026,6.684,5.834,6.801z"
          />
        <path class="piece-14" fill="#FFB100" d="M7.203,4.401c0,0.438-0.099,0.835-0.274,1.2h1.706C8.656,5.527,8.67,5.45,8.687,5.375l-0.81-1.893
          L7.006,3.355C7.136,3.678,7.203,4.026,7.203,4.401z"/>
        <path class="piece-15" class="piece-1" fill="#FFB100" d="M0.631,4.848l0.501-1.164L0.351,3.798C0.17,3.827,0.081,3.902,0.04,4.001
          C0.035,4.057,0.026,4.112,0.023,4.169c0.022,0.067,0.06,0.138,0.133,0.217L0.631,4.848z"/>
        <path class="piece-16" class="piece-1" fill="#FFB100" d="M1.663,5.502C1.659,5.51,1.654,5.526,1.647,5.552c-0.006,0.025-0.012,0.042-0.016,0.05h0.244
          c-0.048-0.1-0.088-0.203-0.124-0.308L1.663,5.502z"/>
        <path class="piece-17" class="piece-1" fill="#DF4000" d="M1.285,7.518C0.917,7.15,0.626,6.709,0.4,6.211v2.592c0,0.107,0.039,0.201,0.119,0.281
          c0.079,0.078,0.173,0.119,0.281,0.119h1.184l0.178-1.032C1.842,7.984,1.542,7.775,1.285,7.518z"/>
        <path class="piece-18" fill="#DF4000" d="M8.456,2.691c0.126,0.296,0.211,0.602,0.269,0.913l0.547,0.08L8.359,1.569
          C8.317,1.465,8.241,1.377,8.131,1.307C8.021,1.235,7.911,1.2,7.803,1.2H7.416c0.032,0.03,0.071,0.053,0.103,0.084
          C7.912,1.679,8.225,2.147,8.456,2.691z"/>
        <path class="piece-19" fill="#DF4000" d="M2.988,2.4h0.966l0.393-0.795c-0.747,0.013-1.39,0.282-1.925,0.817C2.077,2.769,1.854,3.164,1.726,3.598
          l0.801-0.116L2.988,2.4z"/>
        <path class="piece-20" fill="#DF4000" d="M4.908,8.767L4.077,9.204h2.25L5.353,8.691C5.207,8.723,5.059,8.75,4.908,8.767z"/>
        <path class="piece-21" fill="#DF4000" d="M8.028,6.895L9.993,8.86c0.002-0.02,0.011-0.037,0.011-0.057V5.789c0-0.258-0.052-0.515-0.156-0.769
          L9.771,4.844L8.437,6.146C8.324,6.404,8.194,6.656,8.028,6.895z"/>
        <path class="piece-22" fill="#DF4000" d="M2.423,2.423c0.535-0.536,1.178-0.804,1.925-0.817l0.2-0.405H2.602c-0.109,0-0.219,0.035-0.329,0.106
          c-0.11,0.07-0.187,0.158-0.228,0.263L1.133,3.684l0.593-0.086C1.854,3.164,2.077,2.769,2.423,2.423z"/>
        <path class="piece-23" fill="#DF4000" d="M6.449,2.4h0.966l0.462,1.081l0.848,0.123C8.667,3.293,8.582,2.988,8.456,2.691
          C8.225,2.147,7.912,1.679,7.519,1.284C7.487,1.253,7.448,1.23,7.416,1.2h-1.56L6.449,2.4z"/>
        <path class="piece-24" fill="#DF4000" d="M4.908,8.767C5.059,8.75,5.207,8.723,5.353,8.691L5.202,8.612L4.908,8.767z"/>
        <path class="piece-25" fill="#DF4000" d="M2.162,8.171L2.433,6.6L0.631,4.848L0.557,5.021C0.452,5.274,0.4,5.531,0.4,5.789v0.422
          C0.626,6.709,0.917,7.15,1.285,7.518C1.542,7.775,1.842,7.984,2.162,8.171z"/>
        <path class="piece-26" fill="#DF4000" d="M8.437,6.146L7.972,6.6L8.42,9.204h1.184c0.108,0,0.202-0.041,0.281-0.119
          C9.949,9.019,9.98,8.943,9.993,8.86L8.028,6.895C8.194,6.656,8.324,6.404,8.437,6.146z"/>
        <path class="piece-27" fill="#DF4000" d="M4.401,8.803c-0.596,0-1.166-0.115-1.71-0.348c-0.189-0.08-0.358-0.184-0.529-0.284L1.984,9.204h2.092
          l0.831-0.437C4.741,8.785,4.574,8.803,4.401,8.803z"/>
        <path class="piece-28" fill="#DF4000" d="M6.456,6.29C6.653,6.077,6.81,5.847,6.929,5.602H6.797L6.456,6.29z"/>
        <path class="piece-29" fill="#DF4000" d="M6.896,8.028C6.419,8.36,5.901,8.573,5.353,8.691l0.974,0.513h1.748L6.896,8.028z"/>
        <path class="piece-30" fill="#DF4000" d="M8.804,4.401c0,0.337-0.047,0.659-0.117,0.973l0.055,0.127c0.004,0.013,0.009,0.029,0.016,0.05
          c0.006,0.021,0.011,0.037,0.016,0.05H8.635c-0.052,0.186-0.12,0.367-0.198,0.545l1.335-1.302l-0.5-1.16l-0.547-0.08
          C8.772,3.865,8.804,4.13,8.804,4.401z"/>
        <path class="piece-31" fill="#DF4000" d="M3.607,5.602H1.875C2.01,5.88,2.186,6.143,2.423,6.379c0.548,0.549,1.208,0.822,1.979,0.822
          c0.532,0,1.007-0.14,1.433-0.4H4.202L3.607,5.602z"/>
        <path class="piece-32" fill="#DF4000" d="M1.726,3.598C1.651,3.853,1.601,4.117,1.601,4.401c0,0.318,0.059,0.612,0.151,0.892l0.774-1.812
          L1.726,3.598z"/>
        <path class="piece-33" fill="#DF4000" d="M6.354,2.4c-0.543-0.532-1.193-0.8-1.952-0.8c-0.019,0-0.035,0.004-0.054,0.005L3.955,2.4H6.354z"/>
        <path class="piece-34" fill="#DF4000" d="M8.437,6.146c0.078-0.178,0.146-0.359,0.198-0.545H6.929C6.81,5.847,6.653,6.077,6.456,6.29L6.202,6.801
          H5.834c-0.426,0.261-0.901,0.4-1.433,0.4c-0.771,0-1.431-0.273-1.979-0.822C2.186,6.143,2.01,5.88,1.875,5.602H1.632
          c0.004-0.008,0.01-0.024,0.016-0.05c0.007-0.025,0.012-0.042,0.016-0.05l0.089-0.208c-0.093-0.28-0.151-0.574-0.151-0.892
          c0-0.285,0.05-0.549,0.125-0.803L1.133,3.684L0.631,4.848L2.433,6.6L2.162,8.171c0.171,0.101,0.34,0.204,0.529,0.284
          c0.544,0.232,1.114,0.348,1.71,0.348c0.173,0,0.339-0.019,0.506-0.036l0.294-0.155l0.151,0.079C5.901,8.573,6.419,8.36,6.896,8.028
          l1.179,1.176H8.42L7.972,6.6L8.437,6.146z"/>
        <path class="piece-35" fill="#DF4000" d="M8.804,4.401c0-0.271-0.031-0.536-0.079-0.797L7.877,3.481l0.81,1.893C8.757,5.06,8.804,4.739,8.804,4.401z
          "/>
        <path class="piece-36" fill="#DF4000" d="M4.401,1.601c0.759,0,1.409,0.268,1.952,0.8h0.096L5.856,1.2H4.548l-0.2,0.405
          C4.366,1.605,4.383,1.601,4.401,1.601z"/>
    </g>
</svg>

<svg viewBox="0 0 10.404 10.403">
    <g id="icon" class="icon  icon--search">
        <path class="piece-1" d="M7.006,3.355l0.871,0.126L7.415,2.4H6.449l0.128,0.258C6.756,2.876,6.905,3.106,7.006,3.355z"/>
        <path class="piece-2" d="M0.351,3.798l0.782-0.114l0.912-2.115c0.041-0.104,0.117-0.192,0.228-0.263C2.383,1.235,2.492,1.2,2.602,1.2h1.946
          l0.348-0.703C4.975,0.326,5.077,0.24,5.202,0.24s0.227,0.086,0.307,0.257L5.856,1.2h1.56C7.042,0.85,6.612,0.56,6.111,0.347
          C5.567,0.115,4.998,0,4.401,0c-0.596,0-1.166,0.115-1.71,0.347S1.679,0.891,1.285,1.284C0.891,1.679,0.578,2.147,0.347,2.691
          C0.169,3.111,0.081,3.551,0.04,4.001C0.081,3.902,0.17,3.827,0.351,3.798z"/>
        <path class="piece-3" d="M0.557,5.021l0.075-0.173L0.156,4.386c-0.074-0.079-0.111-0.15-0.133-0.217C0.019,4.248,0,4.322,0,4.401
          c0,0.596,0.116,1.166,0.347,1.71c0.015,0.036,0.038,0.065,0.054,0.1V5.789C0.4,5.531,0.452,5.274,0.557,5.021z"/>
        <path class="piece-4" d="M9.993,8.86C9.98,8.943,9.949,9.019,9.885,9.084C9.806,9.163,9.712,9.204,9.604,9.204H8.42l0.071,0.415l0.55,0.548
          c0.15,0.158,0.338,0.236,0.562,0.236c0.217,0,0.404-0.078,0.562-0.236c0.159-0.158,0.238-0.346,0.238-0.562
          c0-0.223-0.077-0.41-0.231-0.564L9.993,8.86z"/>
        <path class="piece-5" fill="#FFB100" d="M6.327,9.204l1.683,0.885c0.087,0.049,0.171,0.074,0.25,0.074c0.083,0,0.146-0.029,0.19-0.09
          S8.516,9.938,8.516,9.85c0-0.055-0.002-0.096-0.006-0.125L8.491,9.619L8.075,9.204H6.327z"/>
        <path class="piece-6" fill="#FFB100" d="M1.895,9.725c-0.009,0.059-0.013,0.1-0.013,0.125c0,0.088,0.022,0.162,0.065,0.223
          c0.044,0.061,0.109,0.09,0.197,0.09c0.075,0,0.158-0.025,0.25-0.074l1.682-0.885H1.984L1.895,9.725z"/>
        <path class="piece-7" fill="#FFB100" d="M10.241,4.386c0.108-0.108,0.163-0.208,0.163-0.3c0-0.154-0.117-0.25-0.351-0.288L9.271,3.684l0.5,1.16
          L10.241,4.386z"/>
        <path class="piece-8" fill="#FFB100" d="M0,4.086c0,0.026,0.014,0.055,0.023,0.083C0.026,4.112,0.035,4.057,0.04,4.001C0.028,4.03,0,4.051,0,4.086z
          "/>
        <path class="piece-9" fill="#FFB100" d="M8.772,5.602c-0.005-0.013-0.01-0.029-0.016-0.05C8.75,5.531,8.745,5.515,8.741,5.502L8.687,5.375
          C8.67,5.45,8.656,5.527,8.635,5.602H8.772z"/>
        <path class="piece-10" fill="#FFB100" d="M7.006,3.355L6.915,3.342L6.577,2.659C6.513,2.58,6.456,2.498,6.381,2.423
          C6.372,2.415,6.362,2.409,6.354,2.4H3.955L3.489,3.342l-0.963,0.14L1.752,5.293c0.035,0.105,0.075,0.208,0.124,0.308h1.732
          l0.595,1.2h1.632c0.191-0.117,0.376-0.252,0.546-0.422c0.028-0.028,0.048-0.061,0.075-0.09l0.341-0.688h0.132
          c0.176-0.365,0.274-0.763,0.274-1.2C7.203,4.026,7.136,3.678,7.006,3.355z"/>
        <path class="piece-11" fill="#FFB100" d="M6.381,2.423C6.456,2.498,6.513,2.58,6.577,2.659L6.449,2.4H6.354C6.362,2.409,6.372,2.415,6.381,2.423z"/>
        <polygon class="piece-1" fill="#FFB100" points="8.075,9.204 8.491,9.619 8.42,9.204 	"/>
        <path class="piece-12" fill="#FFB100" d="M5.509,0.497C5.429,0.326,5.327,0.24,5.202,0.24S4.975,0.326,4.896,0.497L4.548,1.2h1.309L5.509,0.497z"/>
        <path class="piece-13" fill="#FFB100" d="M5.834,6.801h0.368L6.456,6.29c-0.027,0.029-0.047,0.062-0.075,0.09C6.211,6.549,6.026,6.684,5.834,6.801z"
          />
        <path class="piece-14" fill="#FFB100" d="M7.203,4.401c0,0.438-0.099,0.835-0.274,1.2h1.706C8.656,5.527,8.67,5.45,8.687,5.375l-0.81-1.893
          L7.006,3.355C7.136,3.678,7.203,4.026,7.203,4.401z"/>
        <path class="piece-15" class="piece-1" fill="#FFB100" d="M0.631,4.848l0.501-1.164L0.351,3.798C0.17,3.827,0.081,3.902,0.04,4.001
          C0.035,4.057,0.026,4.112,0.023,4.169c0.022,0.067,0.06,0.138,0.133,0.217L0.631,4.848z"/>
        <path class="piece-16" class="piece-1" fill="#FFB100" d="M1.663,5.502C1.659,5.51,1.654,5.526,1.647,5.552c-0.006,0.025-0.012,0.042-0.016,0.05h0.244
          c-0.048-0.1-0.088-0.203-0.124-0.308L1.663,5.502z"/>
        <path class="piece-17" class="piece-1" fill="#DF4000" d="M1.285,7.518C0.917,7.15,0.626,6.709,0.4,6.211v2.592c0,0.107,0.039,0.201,0.119,0.281
          c0.079,0.078,0.173,0.119,0.281,0.119h1.184l0.178-1.032C1.842,7.984,1.542,7.775,1.285,7.518z"/>
        <path class="piece-18" fill="#DF4000" d="M8.456,2.691c0.126,0.296,0.211,0.602,0.269,0.913l0.547,0.08L8.359,1.569
          C8.317,1.465,8.241,1.377,8.131,1.307C8.021,1.235,7.911,1.2,7.803,1.2H7.416c0.032,0.03,0.071,0.053,0.103,0.084
          C7.912,1.679,8.225,2.147,8.456,2.691z"/>
        <path class="piece-19" fill="#DF4000" d="M2.988,2.4h0.966l0.393-0.795c-0.747,0.013-1.39,0.282-1.925,0.817C2.077,2.769,1.854,3.164,1.726,3.598
          l0.801-0.116L2.988,2.4z"/>
        <path class="piece-20" fill="#DF4000" d="M4.908,8.767L4.077,9.204h2.25L5.353,8.691C5.207,8.723,5.059,8.75,4.908,8.767z"/>
        <path class="piece-21" fill="#DF4000" d="M8.028,6.895L9.993,8.86c0.002-0.02,0.011-0.037,0.011-0.057V5.789c0-0.258-0.052-0.515-0.156-0.769
          L9.771,4.844L8.437,6.146C8.324,6.404,8.194,6.656,8.028,6.895z"/>
        <path class="piece-22" fill="#DF4000" d="M2.423,2.423c0.535-0.536,1.178-0.804,1.925-0.817l0.2-0.405H2.602c-0.109,0-0.219,0.035-0.329,0.106
          c-0.11,0.07-0.187,0.158-0.228,0.263L1.133,3.684l0.593-0.086C1.854,3.164,2.077,2.769,2.423,2.423z"/>
        <path class="piece-23" fill="#DF4000" d="M6.449,2.4h0.966l0.462,1.081l0.848,0.123C8.667,3.293,8.582,2.988,8.456,2.691
          C8.225,2.147,7.912,1.679,7.519,1.284C7.487,1.253,7.448,1.23,7.416,1.2h-1.56L6.449,2.4z"/>
        <path class="piece-24" fill="#DF4000" d="M4.908,8.767C5.059,8.75,5.207,8.723,5.353,8.691L5.202,8.612L4.908,8.767z"/>
        <path class="piece-25" fill="#DF4000" d="M2.162,8.171L2.433,6.6L0.631,4.848L0.557,5.021C0.452,5.274,0.4,5.531,0.4,5.789v0.422
          C0.626,6.709,0.917,7.15,1.285,7.518C1.542,7.775,1.842,7.984,2.162,8.171z"/>
        <path class="piece-26" fill="#DF4000" d="M8.437,6.146L7.972,6.6L8.42,9.204h1.184c0.108,0,0.202-0.041,0.281-0.119
          C9.949,9.019,9.98,8.943,9.993,8.86L8.028,6.895C8.194,6.656,8.324,6.404,8.437,6.146z"/>
        <path class="piece-27" fill="#DF4000" d="M4.401,8.803c-0.596,0-1.166-0.115-1.71-0.348c-0.189-0.08-0.358-0.184-0.529-0.284L1.984,9.204h2.092
          l0.831-0.437C4.741,8.785,4.574,8.803,4.401,8.803z"/>
        <path class="piece-28" fill="#DF4000" d="M6.456,6.29C6.653,6.077,6.81,5.847,6.929,5.602H6.797L6.456,6.29z"/>
        <path class="piece-29" fill="#DF4000" d="M6.896,8.028C6.419,8.36,5.901,8.573,5.353,8.691l0.974,0.513h1.748L6.896,8.028z"/>
        <path class="piece-30" fill="#DF4000" d="M8.804,4.401c0,0.337-0.047,0.659-0.117,0.973l0.055,0.127c0.004,0.013,0.009,0.029,0.016,0.05
          c0.006,0.021,0.011,0.037,0.016,0.05H8.635c-0.052,0.186-0.12,0.367-0.198,0.545l1.335-1.302l-0.5-1.16l-0.547-0.08
          C8.772,3.865,8.804,4.13,8.804,4.401z"/>
        <path class="piece-31" fill="#DF4000" d="M3.607,5.602H1.875C2.01,5.88,2.186,6.143,2.423,6.379c0.548,0.549,1.208,0.822,1.979,0.822
          c0.532,0,1.007-0.14,1.433-0.4H4.202L3.607,5.602z"/>
        <path class="piece-32" fill="#DF4000" d="M1.726,3.598C1.651,3.853,1.601,4.117,1.601,4.401c0,0.318,0.059,0.612,0.151,0.892l0.774-1.812
          L1.726,3.598z"/>
        <path class="piece-33" fill="#DF4000" d="M6.354,2.4c-0.543-0.532-1.193-0.8-1.952-0.8c-0.019,0-0.035,0.004-0.054,0.005L3.955,2.4H6.354z"/>
        <path class="piece-34" fill="#DF4000" d="M8.437,6.146c0.078-0.178,0.146-0.359,0.198-0.545H6.929C6.81,5.847,6.653,6.077,6.456,6.29L6.202,6.801
          H5.834c-0.426,0.261-0.901,0.4-1.433,0.4c-0.771,0-1.431-0.273-1.979-0.822C2.186,6.143,2.01,5.88,1.875,5.602H1.632
          c0.004-0.008,0.01-0.024,0.016-0.05c0.007-0.025,0.012-0.042,0.016-0.05l0.089-0.208c-0.093-0.28-0.151-0.574-0.151-0.892
          c0-0.285,0.05-0.549,0.125-0.803L1.133,3.684L0.631,4.848L2.433,6.6L2.162,8.171c0.171,0.101,0.34,0.204,0.529,0.284
          c0.544,0.232,1.114,0.348,1.71,0.348c0.173,0,0.339-0.019,0.506-0.036l0.294-0.155l0.151,0.079C5.901,8.573,6.419,8.36,6.896,8.028
          l1.179,1.176H8.42L7.972,6.6L8.437,6.146z"/>
        <path class="piece-35" fill="#DF4000" d="M8.804,4.401c0-0.271-0.031-0.536-0.079-0.797L7.877,3.481l0.81,1.893C8.757,5.06,8.804,4.739,8.804,4.401z
          "/>
        <path class="piece-36" fill="#DF4000" d="M4.401,1.601c0.759,0,1.409,0.268,1.952,0.8h0.096L5.856,1.2H4.548l-0.2,0.405
          C4.366,1.605,4.383,1.601,4.401,1.601z"/>
    </g>
</svg>







<!--Icons from template-->
<!--
<svg viewBox="0 0 11.203 10.403">
    <use xlink:href="#icon" class="icon  icon--search">
</svg>

<svg viewBox="0 0 11.203 10.403">
    <use xlink:href="#icon" class="icon  icon--inbox">
</svg>

<svg viewBox="0 0 11.203 10.403">
    <use xlink:href="#icon" class="icon  icon--favorite">
</svg>
-->
            
          
!

CSS

            
              :root {
    background: skyblue;
}

.template {
    /* display: none; */
}

svg {
    width: 80px;
    height: 80px;
}

.icon [class^="piece"] {
    fill: none;
}

.icon--search .piece-1,
.icon--search .piece-2,
.icon--search .piece-3,
.icon--search .piece-4,
.icon--search .piece-11,
.icon--search .piece-12,
.icon--search .piece-13,
.icon--search .piece-14,
.icon--search .piece-15,
.icon--search .piece-16,
.icon--search .piece-22,
.icon--search .piece-23,
.icon--search .piece-24,
.icon--search .piece-25,
.icon--search .piece-26,
.icon--search .piece-34,
.icon--search .piece-35,
.icon--search .piece-36 {
    fill: orangered;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................