The Phosphor file svg icon depicts a document with an SVG file type indicator, commonly used to represent SVG files or vector graphics in user interfaces.
Common uses
- Button to upload or download SVG files.
- Indicator for vector-based image assets.
- File type filter option in a document manager.
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { FileSvg } from '@phosphor-icons/react';
<FileSvg size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<FileSvg size={24} />thin
<FileSvg size={24} weight="thin" />light
<FileSvg size={24} weight="light" />bold
<FileSvg size={24} weight="bold" />fill
<FileSvg size={24} weight="fill" />duotone
<FileSvg size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- system
- Keywords
- documentsimagesvectorsystemmediafilesvgvector filesvg documentimage filesystem file
FAQ
- What does the file svg icon represent?
- It represents a file that uses the Scalable Vector Graphics (SVG) format. It's typically used to signify documents or images that are vector-based.
- How do I use this icon in React?
- You can import and use it in React with: import { FileSvg } from '@phosphor-icons/react'. Then render it as <FileSvg size={24} />.
- What is the license for this icon?
- The Phosphor icon library, including the file svg icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Phosphor.
Looking for something else? Search Phosphor and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →