IconSearch logoIconsearch
Home/Libraries/coolicons (Iconify)/file-svg
← Back to Search
coolicons (Iconify)

FileSvg

License: CC-BY-4.0


<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24"><path fill="#818cf8" d="M18 22H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7a.104.104 0 0 1 .027 0h.006a.15.15 0 0 0 .029.006c.088.006.175.023.259.051h.042a.421.421 0 0 1 .052.043a.988.988 0 0 1 .293.2l6 6a.987.987 0 0 1 .2.293a.735.735 0 0 1 .023.066l.01.028c.028.083.044.17.049.258a.1.1 0 0 0 .007.029v.006A.112.112 0 0 1 20 9v11a2 2 0 0 1-2 2Zm-2.5-8c-.454-.024-.89.18-1.161.545a2.6 2.6 0 0 0-.4 1.547v.876a2.426 2.426 0 0 0 .432 1.514c.29.35.728.541 1.181.518c.28.003.557-.05.816-.154l.013-.005l-.016.007c.245-.101.46-.26.63-.464v-2.011h-1.509v.742h.623v.893l-.078.06a.723.723 0 0 1-.427.117a.641.641 0 0 1-.592-.3a2.01 2.01 0 0 1-.178-.969v-.883a2.018 2.018 0 0 1 .166-.926a.557.557 0 0 1 .523-.292a.531.531 0 0 1 .435.171c.117.19.177.41.175.632H17a1.96 1.96 0 0 0-.423-1.227A1.4 1.4 0 0 0 15.5 14ZM7 17.4c-.006.296.063.59.2.852c.126.234.317.426.55.555c.237.129.503.195.773.193c.366.02.724-.11.994-.357a1.33 1.33 0 0 0 .366-.993c.013-.34-.09-.676-.293-.95a2.186 2.186 0 0 0-.934-.632a1.652 1.652 0 0 1-.513-.334a.536.536 0 0 1-.143-.367a.608.608 0 0 1 .13-.408a.45.45 0 0 1 .363-.154c.148-.008.29.06.377.181A.853.853 0 0 1 9 15.5h.886a1.739 1.739 0 0 0-.172-.782a1.245 1.245 0 0 0-.487-.531A1.382 1.382 0 0 0 8.505 14a1.409 1.409 0 0 0-1 .374a1.3 1.3 0 0 0-.393.986a1.4 1.4 0 0 0 .291.882c.258.293.585.516.951.649c.186.072.356.18.5.317c.101.127.15.287.139.448c0 .361-.157.544-.465.544a.58.58 0 0 1-.484-.19a1.012 1.012 0 0 1-.148-.612L7 17.4Zm3.182-3.332l1.26 4.866h.925l1.269-4.866h-.991L11.9 17.6l-.737-3.529l-.981-.003ZM13 4v5h5l-5-5Z"/></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard
Dashboard
Analytics
Settings

Overview Dashboard

PROGRESS STEPPER

3

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px
16px
24px
32px
48px

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. FileSvgIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.

Related Icons in coolicons (Iconify)

Browse all coolicons (Iconify) icons →
add-column
add-column
add-minus-square
add-minus-square
add-plus
add-plus
add-plus-circle
add-plus-circle
add-plus-square
add-plus-square
add-row
add-row
add-to-queue
add-to-queue
adobe-xd
adobe-xd
airplay
airplay
alarm
alarm
alarm-add
alarm-add
app-store
app-store