IconHubDesign System

Collections

Empty Collection

Add icons to this collection by clicking the heart icon.

Attachment icon - Gradient | SVG & PNG Free Download

Style Variants

Attachment

Attachment icon - also known as interface, file, document, extension, files, documents, attachment, attach, multimedia, archive, files and folders, and business and finance. Created in a clean gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.

7/24/2025

Tags

files and folders

business and finance

Usage Snippets

Attachment.svg

<svg
    xmlns="http://www.w3.org/2000/svg"
    width="100"
    height="100"
    viewBox="0 0 480 480"
>
    <linearGradient
        id="a"
        x1="-56.697"
        x2="2.335"
        y1="587.125"
        y2="587.125"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path
        d="M60 376c33.122-.035 59.965-26.878 60-60V208h-16v108c0 24.301-19.699 44-44 44s-44-19.699-44-44V156c0-15.464 12.536-28 28-28s28 12.536 28 28v144c0 6.627-5.373 12-12 12s-12-5.373-12-12v-92H32v92c0 15.464 12.536 28 28 28s28-12.536 28-28V156c0-24.301-19.699-44-44-44S0 131.699 0 156v160c.035 33.122 26.878 59.965 60 60z"
        fill="url(#a)"
    />
    <linearGradient
        id="b"
        x1="-56.697"
        x2="2.335"
        y1="587.625"
        y2="587.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path
        d="M376 96h-16v32h-16V44c0-24.301-19.699-44-44-44s-44 19.699-44 44v84h-96v352h320V128H376V96zm-16 48v60c0 24.301-19.699 44-44 44s-44-19.699-44-44v-60h16v44c0 15.464 12.536 28 28 28s28-12.536 28-28v-44h16zm-56 0h24v44c0 6.627-5.373 12-12 12s-12-5.373-12-12v-44zM272 44c0-15.464 12.536-28 28-28s28 12.536 28 28v84h-24V96h-16v32h-16V44zm192 100v320H176V144h80v60c0 33.137 26.863 60 60 60s60-26.863 60-60v-60h88z"
        fill="url(#b)"
    />
    <linearGradient
        id="c"
        x1="-56.697"
        x2="2.335"
        y1="580.625"
        y2="580.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M200 288h32v16h-32v-16z" fill="url(#c)" />
    <linearGradient
        id="d"
        x1="-56.697"
        x2="2.335"
        y1="580.625"
        y2="580.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M248 288h192v16H248v-16z" fill="url(#d)" />
    <linearGradient
        id="e"
        x1="-56.697"
        x2="2.335"
        y1="576.625"
        y2="576.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M200 320h32v16h-32v-16z" fill="url(#e)" />
    <linearGradient
        id="f"
        x1="-56.697"
        x2="2.335"
        y1="576.625"
        y2="576.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M248 320h192v16H248v-16z" fill="url(#f)" />
    <linearGradient
        id="g"
        x1="-56.697"
        x2="2.335"
        y1="572.625"
        y2="572.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M200 352h32v16h-32v-16z" fill="url(#g)" />
    <linearGradient
        id="h"
        x1="-56.697"
        x2="2.335"
        y1="572.625"
        y2="572.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M248 352h192v16H248v-16z" fill="url(#h)" />
    <linearGradient
        id="i"
        x1="-56.697"
        x2="2.335"
        y1="566.625"
        y2="566.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M200 432h48v-48h-48v48zm16-32h16v16h-16v-16z" fill="url(#i)" />
    <linearGradient
        id="j"
        x1="-56.697"
        x2="2.335"
        y1="566.625"
        y2="566.625"
        gradientTransform="matrix(8 0 0 -8 455 4941)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#4761ac" />
        <stop offset="1" stop-color="#54c2ef" />
    </linearGradient>
    <path d="M264 432h176v-48H264v48zm16-32h144v16H280v-16z" fill="url(#j)" />
</svg>