IconHubDesign System

Collections

Empty Collection

Add icons to this collection by clicking the heart icon.

File icon - Gradient | SVG & PNG Free Download

Style Variants

File

File icon - also known as interface, file, document, archive, records, and files and folders. 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

Usage Snippets

File.svg

<svg
    xmlns="http://www.w3.org/2000/svg"
    width="512"
    height="512"
    viewBox="0 2 98 98"
>
    <linearGradient
        id="a"
        x1="34.45"
        x2="34.45"
        y1="97.667"
        y2="7.294"
        gradientTransform="matrix(1 0 0 -1 0 104)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#00efd1" />
        <stop offset="1" stop-color="#00acea" />
    </linearGradient>
    <path
        d="M25.2 55.5h18.5c1.7 0 3-1.3 3-3s-1.3-3-3-3H25.2c-1.7 0-3 1.3-3 3s1.3 3 3 3z"
        fill="url(#a)"
    />
    <linearGradient
        id="b"
        x1="39.45"
        x2="39.45"
        y1="97.667"
        y2="7.294"
        gradientTransform="matrix(1 0 0 -1 0 104)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#00efd1" />
        <stop offset="1" stop-color="#00acea" />
    </linearGradient>
    <path
        d="M53.7 61.3H25.2c-1.7 0-3 1.3-3 3s1.3 3 3 3h28.5c1.7 0 3-1.3 3-3s-1.3-3-3-3z"
        fill="url(#b)"
    />
    <linearGradient
        id="c"
        x1="39.45"
        x2="39.45"
        y1="97.667"
        y2="7.294"
        gradientTransform="matrix(1 0 0 -1 0 104)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#00efd1" />
        <stop offset="1" stop-color="#00acea" />
    </linearGradient>
    <path
        d="M53.7 73.1H25.2c-1.7 0-3 1.3-3 3s1.3 3 3 3h28.5c1.7 0 3-1.3 3-3s-1.3-3-3-3z"
        fill="url(#c)"
    />
    <linearGradient
        id="d"
        x1="49"
        x2="49"
        y1="97.667"
        y2="7.294"
        gradientTransform="matrix(1 0 0 -1 0 104)"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#00efd1" />
        <stop offset="1" stop-color="#00acea" />
    </linearGradient>
    <path
        d="M87.4 24 69.7 7.4c-.6-.5-1.3-.8-2.1-.8H31.8c-1.7 0-3 1.3-3 3v10.7H12.7c-1.7 0-3 1.3-3 3v69.1c0 1.7 1.3 3 3 3h53.5c1.7 0 3-1.3 3-3V81.7h16.1c1.7 0 3-1.3 3-3V26.2c0-.8-.3-1.6-.9-2.2zm-16.8-7.5 7.1 6.7h-7.1v-6.7zM15.7 89.4V26.3h29.8v13.6c0 1.7 1.3 3 3 3h14.7v46.5H15.7zm35.8-59.2 7.1 6.7h-7.1v-6.7zm17.7 45.5V39.9c0-.8-.3-1.6-.9-2.2L50.6 21.1c-.6-.5-1.3-.8-2.1-.8H34.8v-7.7h29.8v13.6c0 1.7 1.3 3 3 3h14.7v46.5H69.2z"
        fill="url(#d)"
    />
</svg>