Figma Component / Ant Design X
FileCard
Display files in the form of cards.
Documentation
What is Figma FileCard?
FileCard displays file assets as card-like items with metadata and quick actions. It gives users a richer visual summary than plain file rows, including format cues and contextual controls.
When to Use FileCard?
Use FileCard when files need stronger visual emphasis, such as referenced documents, generated assets, or shared resources. It is effective in galleries, result panels, and chat flows that involve multiple attachments.
How to Design FileCard?
Expose key file attributes first, such as name, type, size, and status. Keep card density balanced, use clear action affordances, and ensure cards align well in responsive grids or stacked layouts.
How FileCard Component is Designed in Ant Design System for Figma?
In Ant Design System for Figma, FileCard follows Ant token rules for spacing, radius, and typography and is designed to pair with Attachments and Sources. This keeps file-related UI patterns visually consistent across AI workflows.
Related components
This component is part of the Ant Design System for Figma. Browse Ant Design Figma templates or view kit pricing.