Add icons to this collection by clicking the heart icon.
Before After icon - also known as photo, compare, effects, edit tools, retouch, and before after. Created in a clean lineal style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="682.667"
height="682.667"
viewBox="0 0 682.667 682.667"
>
<defs>
<clipPath id="a" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
</defs>
<g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M0 0v-124.37c0-8.92 7.23-16.16 16.16-16.16s16.16 7.24 16.16 16.16v464.68c0 4.46-1.81 8.5-4.73 11.419a16.11 16.11 0 0 1-11.43 4.741C7.23 356.47 0 349.229 0 340.31V35"
transform="translate(239.84 148.03)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v35c0 11.16 9.05 20.2 20.2 20.2h212.14"
transform="translate(7.5 402.83)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-293.66c0-11.16 9.05-20.2 20.2-20.2h212.14"
transform="translate(7.5 367.83)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h8"
transform="translate(272.162 53.968)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="4"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h172.61c11.159 0 20.203 9.045 20.203 20.203v363.658c0 11.159-9.044 20.203-20.203 20.203H-15.762"
transform="translate(311.687 53.968)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="4"
stroke-dasharray="15.762,31.524"
stroke-dashoffset="0"
stroke-opacity="1"
/>
<path
d="M0 0h-8"
transform="translate(280.162 458.032)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="4"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c16.72-15 27.229-36.779 27.229-61.01 0-45.28-36.699-81.98-81.979-81.98s-81.98 36.7-81.98 81.98c0 45.281 36.7 81.981 81.98 81.981 8.49 0 16.67-1.29 24.37-3.691"
transform="translate(443.08 317.01)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c6.548 6.549 6.548 17.166 0 23.715-6.549 6.549-17.166 6.549-23.715 0L-51.258-3.828l-5.687 5.688c-6.549 6.548-17.166 6.548-23.714 0-6.549-6.548-6.549-17.166 0-23.714l17.833-17.256c6.549-6.549 17.166-6.549 23.715 0z"
transform="translate(430.188 261.669)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
</svg>
More icons in the same style and category