Tailwind CSS Attachment Components

Dev Design Library indexes 27 Tailwind CSS attachment components from 17 open-source UI libraries, with the most coming from ReUI, AI Elements, Fibo, Cojeev UI and Fluid Functionalism. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list styles its components with Tailwind CSS utility classes. Attachment components belong to the AI group.

• Attachmentshadcn/ui · ReactDisplays a file or image attachment with media, metadata, upload state, and actions.
• Ai Attachment GridReact Spectrum · React
• Single file attachment in an assistant replyReUI · ReactSingle file attachment in an assistant reply
• AttachmentsAI Elements · ReactA flexible, composable attachment component for displaying files, images, videos, audio, and source documents.
• AI AttachmentKokonut UI · ReactA file dropped into the chat uploads, then the assistant reads it page by page. Page citations in the answer light up…
• Attachment UploadbeUI · ReactA mixed attachment workspace with a dropzone, staggered file and image rows, animated upload, success, failure, retry…
• Prompt ComposerSpectrum UI · ReactA prompt input with attachments, a model picker, and a stop state.
• File ThumbnailFluid Functionalism · ReactRead-only square preview of a File. Images render via object-cover; PDFs render their first page via pdfjs; a spinner…
• AttachmentPanel UI · React NativeFile row with upload states, built on Item.
• Prompt InputAI Elements (Svelte) · SvelteA composable prompt input surface with attachments, action menus, and provider-driven text handling.
• AttachmentHextaUI · ReactFile and image cards for uploads, with progress, states, actions, a full-card trigger and names that keep their…
• Prompt Input AttachmentsLocalMode · ReactAttachment surface for the composer: image/file attach via picker, paste, and drag-and-drop with preview thumbnails…
• Agent chatCojeev UI · ReactA composable agent conversation with a bounded thread, draft composer, attachments, progress, explicit permissions and…
• Message Composer With Attachmentssv-particles · Svelte
• AttachmentMetal UI · React + SwiftUIA file someone attached, as a small raised plate: type, name, size or an explicit upload receipt; shared glyphs morph…
• AttachmentD2Studio UI · ReactA file attachment chip with a preview, name, size and a remove action.
• AttachmentFibo · ReactOne added file as a chip or an image thumbnail, with its upload status and buttons to remove or retry.
• Ai Attachment ListReact Spectrum · React
• Composer tray with removable attachmentsReUI · ReactComposer tray with removable attachments
• Prompt InputAI Elements · ReactAllows a user to send a message with file attachments to a large language model. It includes a textarea, file upload…
• Input MessageFluid Functionalism · ReactChat-style message composer with auto-resizing textarea, drag-and-drop file attachments (PNG / JPEG / PDF), flexible…
• AttachmentCojeev UI · ReactPresents a file name, type, metadata, and nearby actions as a compact attachment row.
• Chat ComposerFibo · ReactA message box built from parts around one draft, so each chat surface composes its own.
• Image thumbnails in a snapping stripReUI · ReactImage thumbnails in a snapping strip
• Three sizes carrying three levels of an answerReUI · ReactThree sizes carrying three levels of an answer
• Upload queue across all five statesReUI · ReactUpload queue across all five states
• File picker that fills an attachment trayReUI · ReactFile picker that fills an attachment tray

Libraries with Tailwind CSS attachment components

• ReUI
• AI Elements
• Fibo
• Cojeev UI
• Fluid Functionalism

Related categories

• Attachment Components
• React Attachment Components
• Tailwind CSS AI Element Components
• Tailwind CSS Prompt Input Components
• Tailwind CSS Conversation Components
• Tailwind CSS Voice Input Components
• Tailwind CSS Model Selector Components
• Tailwind CSS Thinking Indicator Components
• Tailwind CSS Tool Call Components
• Tailwind CSS Sources Components
• Tailwind CSS Citation Components
• Tailwind CSS AI Message Components
• Tailwind CSS Reasoning Components
• Tailwind CSS AI Orb Components
• Tailwind CSS Streaming Text Components
• Tailwind CSS Suggestions Components
• Tailwind CSS Task Queue Components
• Tailwind CSS Agent Plan Components