File Type Icon

Resolves a file extension to the mark for its format, falling back to a generic document.

Preview

pdf
xlsx
csv
docx
pptx
png
mp4
zip

Installation

Install the package using your preferred package manager:

npx shadcn@latest add @airy/file-type-icon

Usage

Import the component from the package:

import { FileTypeIcon } from "@/components/ui/file-type-icon"

Then use it in your application:

<FileTypeIcon />

Examples

Sizes

Folders and Lev documents

folder
empty-folder
memo
map

Inside an attachment

loan-summary.pdf2.4 MB