# Shadcn File Type

> Open-source shadcn file type icon components for file extensions, export formats, and file browsers.

- Type: ReUI component, free
- Page: https://reui.io/components/file-type
- Docs (Base UI): https://reui.io/docs/components/base/file-type.md
- Docs (Radix UI): https://reui.io/docs/components/radix/file-type.md
- MCP: `get_component("file-type")`, then `get_examples("file-type")`
- Examples: 14

## When to use

- Attachment lists, upload queues and file browser rows, each icon resolved from a name or MIME type
- Export format pickers and legends of the formats a product accepts or produces
- Version tags, document codes and marks such as a lock or star drawn on a document

## When not to use

- A drop zone or picker that collects documents before they are sent: use [File Upload](https://reui.io/components/file-upload.md) (`get_component("file-upload")`)
- Documents carried by a chat message as chips with idle, uploading and error states: use [Attachment](https://reui.io/components/attachment.md) (`get_component("attachment")`)
- A complete drive page with a folder tree, list and grid views and bulk actions: use the [Files blocks](https://reui.io/blocks/solutions/files.md)

## Agent notes

- `type` takes an extension, not a file name: report.pdf passed straight in draws a neutral page labeled REPORT.PDF, so run names through `getFileType`
- `FileType` is not focusable and has no keyboard behavior, so an action goes on a wrapping `Button` or link with its own accessible name

## Examples

- [Common Formats](https://reui.io/components/file-type/c-file-type-1.md): Common formats. Best for a 5 column grid of 10 everyday formats in the default outline at 40px, uncaptioned because each icon names itself.
- [Variants](https://reui.io/components/file-type/c-file-type-2.md): Outline, solid, light and mono. Best for one row per variant over the same 5 types, PDF, DOCX, XLSX, JPG and ZIP, so only the paint changes between rows.
- [Sizes](https://reui.io/components/file-type/c-file-type-3.md): Sizes. Best for a PDF at each size preset from mini to xl, captioned with the prop value and its pixel box, bottoms aligned.
- [Family Glyphs](https://reui.io/components/file-type/c-file-type-4.md): Family glyphs. Best for all 13 family types from the exported category list, captioned by name, with the blank empty page placed last.
- [All Formats](https://reui.io/components/file-type/c-file-type-5.md): All formats. Best for the full extension table split into 11 family rows with counts, painted in whichever of 4 variant tabs is active.
- [File Browser](https://reui.io/components/file-type/c-file-type-6.md): Data grid file browser. Best for folders sorted ahead of files, a Type column filled from each family, and item counts in place of sizes for folders.
- [Attachment List](https://reui.io/components/file-type/c-file-type-7.md): Attachment list. Best for static rows pairing a light page with the name, size and a dated time element, ending in a ghost download button.
- [Upload Queue](https://reui.io/components/file-type/c-file-type-8.md): Upload queue. Best for a live count of uploaded and failed items above rows that swap a named bar for a size line, with retry and cancel.
- [Resolve From Name](https://reui.io/components/file-type/c-file-type-9.md): Resolve from a file name. Best for sample chips under one input with a clear button, the result in all 4 variants and a live Type and Family readout.
- [Custom Labels](https://reui.io/components/file-type/c-file-type-10.md): Custom labels. Best for a revision history newest first, rows tagged SIGNED or V1 to V3, under a large blank page carrying a CA-1042 code.
- [Custom Colors](https://reui.io/components/file-type/c-file-type-11.md): Custom colors and unknown types. Best for the same 4 CAD and 3D formats twice, on the default neutral page and then recolored teal, indigo, orange and rose.
- [Format Picker](https://reui.io/components/file-type/c-file-type-12.md): Export format picker. Best for a preselected PDF choice among 5, a button labeled with the picked extension, and a status line naming the result.
- [Locked & Starred](https://reui.io/components/file-type/c-file-type-13.md): Locked, linked and starred. Best for pairs of outline and solid pages for 6 states, from verified and hidden to uploading, captioned with state and format.
- [Restyled Labels](https://reui.io/components/file-type/c-file-type-14.md): Restyled labels. Best for each badge recipe printed beside its class string, from a pill and an inverted band to a DRAFT tag in amber.

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.
