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

Office Supplies 18

File icon - also known as file, paper, folder, archive, office supplies, binder, 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/14/2025

Tags

office supplies

files and folders

Usage Snippets

File.svg

<svg
    xmlns="http://www.w3.org/2000/svg"
    width="512"
    height="512"
    viewBox="0 0 64 64"
>
    <linearGradient
        id="a"
        x1="14"
        x2="14"
        y1="61.733"
        y2="7.136"
        gradientUnits="userSpaceOnUse"
    >
        <stop offset="0" stop-color="#006df0" />
        <stop offset="1" stop-color="#00e7f0" />
    </linearGradient>
    <linearGradient id="b" x1="32" x2="32" y1="61.733" y2="7.136" href="#a" />
    <linearGradient id="c" x1="50" x2="50" y1="61.733" y2="7.136" href="#a" />
    <g>
        <path
            fill="url(#a)"
            d="M14 6a5 5 0 1 0 5 5 5.006 5.006 0 0 0-5-5zm0 8a3 3 0 1 1 3-3 3 3 0 0 1-3 3zM18 20h-8a1 1 0 0 0-1 1v22a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V21a1 1 0 0 0-1-1zm-1 22h-6V22h6z"
        />
        <path
            fill="url(#b)"
            d="M32 6a5 5 0 1 0 5 5 5.006 5.006 0 0 0-5-5zm0 8a3 3 0 1 1 3-3 3 3 0 0 1-3 3zM36 20h-8a1 1 0 0 0-1 1v22a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V21a1 1 0 0 0-1-1zm-1 22h-6V22h6z"
        />
        <path
            fill="url(#b)"
            d="M55 2H45a4.994 4.994 0 0 0-4 2.03A4.994 4.994 0 0 0 37 2H27a4.994 4.994 0 0 0-4 2.03A4.994 4.994 0 0 0 19 2H9a5 5 0 0 0-5 5v50a5 5 0 0 0 5 5h10a4.994 4.994 0 0 0 4-2.03A4.994 4.994 0 0 0 27 62h10a4.994 4.994 0 0 0 4-2.03A4.994 4.994 0 0 0 45 62h10a5 5 0 0 0 5-5V7a5 5 0 0 0-5-5zM22 57a3.009 3.009 0 0 1-3 3H9a3.009 3.009 0 0 1-3-3V7a3.009 3.009 0 0 1 3-3h10a3.009 3.009 0 0 1 3 3zm18 0a3.009 3.009 0 0 1-3 3H27a3.009 3.009 0 0 1-3-3V7a3.009 3.009 0 0 1 3-3h10a3.009 3.009 0 0 1 3 3zm18 0a3.009 3.009 0 0 1-3 3H45a3.009 3.009 0 0 1-3-3V7a3.009 3.009 0 0 1 3-3h10a3.009 3.009 0 0 1 3 3z"
        />
        <g fill="url(#c)">
            <path
                d="M50 6a5 5 0 1 0 5 5 5.006 5.006 0 0 0-5-5zm0 8a3 3 0 1 1 3-3 3 3 0 0 1-3 3zM54 20h-8a1 1 0 0 0-1 1v22a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V21a1 1 0 0 0-1-1zm-1 22h-6V22h6zM54 56h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM54 52h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM54 48h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2z"
            />
        </g>
        <path
            fill="url(#b)"
            d="M36 56h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM36 52h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM36 48h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2z"
        />
        <path
            fill="url(#a)"
            d="M18 56h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM18 52h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2zM18 48h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2z"
        />
    </g>
</svg>