Skip to content

React component that makes it easy to render themeable svg file icons.

License

Notifications You must be signed in to change notification settings

teamzira/react-file-icon

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

33 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React File Icon

npm version gh workflow

CodeSandbox demo with default icon styles.

import { FileIcon } from 'react-file-icon';

Props

Property Type Default Description
color string whitesmoke Color of icon background
extension string undefined Text to display in label
fold bool true Displays the corner fold
foldColor string undefined Color of the corner fold
glyphColor string undefined Color of file type icon
gradientColor string white Color of page gradient
gradientOpacity number 0.25 Opacity of page gradient
labelColor string undefined Color of label
labelTextColor string white Color of label text
labelUppercase bool false Displays the label in all caps
radius number 4 Corner radius of the file icon
type enum undefined Type of glyph icon to display (One of: 3d, acrobat, audio, binary, code, compressed, document, drive, font, image, presentation, settings, spreadsheet, vector, video)

Default Styles

We also export an object of default styles that can be used as a starting point when rendering icons. Object keys map to file extensions.

import { FileIcon, defaultStyles } from 'react-file-icon';

// Render a .docx icon with default styles
<FileIcon extension="docx" {...defaultStyles.docx} />;

About

React component that makes it easy to render themeable svg file icons.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%