Story
When I ask the AI about my own files, I want to see each file I added and whether it arrived, so I know what the answer is based on.
Ayesha, who runs a small catering business in Birmingham, checking 2 supplier invoices on her phone.
- 01 Setting
Ayesha wants to check 2 invoices against her rice order.
- 02 Trigger
She adds both PDFs. 1 is a 24 MB scan.
- 03 Without it
The box shows "1 file". She doesn't notice, and the answer says the order is 15 kg short.
- 04 With it
A chip per file. The scan's chip says "Over 20 MB · not added · Replace". She replaces it with a smaller copy.
- 05 Outcome
The answer covers both invoices: 25 kg plus 15 kg, as ordered.
Live demo
This demo follows a script, so it plays the same every time - there is no real AI behind it. Change a setting to see the same moment play out differently.
What happens, step by step
| State | The person sees | The AI is | When | Screen reader |
|---|---|---|---|---|
| 1 | A "+" in the box opens Files, Photos, Camera. Drag and drop and paste also work. | Idle. | on tap | - |
| 2 | A chip per file appears at once, before the upload is done. | Idle. | - | - |
| 3 | Each chip has its own progress bar. Send waits until all are done. | Reads the files. | 1-5 s | “Uploading 2 files” |
| 4 | Each chip shows name, type and size, with an X to remove. A file that failed says why and offers Replace. | Idle. | when uploaded | “"2 files attached", or which file failed” |
| 5 | The replacement uploads in the same place in the list. | Reads the new file. | on tap | “Uploading the new file” |
| 6 | The ask, with the chips above it. | Idle. | - | - |
| 7 | The sent message lists the files by name. The answer names which file each fact came from. | Writes. | - | “Generating a response” |
| 8 | Files stay attached to that message, so people can check later what was used. | Idle. | when done | “Response complete” |
On each device
- phone
- The + opens a sheet: Files, Photos, Camera. Chips stack 1 per row above the box so long names fit.
- tablet
- As on desktop, with drag and drop from other apps in split view.
- desktop
- Drag and drop anywhere on the chat, or paste. Chips sit in a row above the box and wrap.
When to use it
- People ask about their own documents, images, data or code.
- The answer depends on which files were read, so people need to check them.
- Uploads can fail - size, type, page or file limits.
- The context is the page people are already on - attach it for them as 1 chip. Use Entry point and AI button instead.
- People want to show the AI something live, like a camera view or their screen. Use Multimodal input instead.
- The files are part of a long-running project - keep them in the project, not each message. Use Agent workspace and management instead.
The parts of the pattern
- AAdd1 + button for files, photos and camera. Drag, drop and paste do the same.
- BFile chipThe file's name and type icon, 1 chip per file.
- CSize and statusPages or size when ready. Progress while uploading. The reason when it failed.
- DRemoveAn X on each chip, so 1 file can go without starting again.
- ESendWaits until every chip is ready, so nothing is sent half uploaded.
Do and Avoid
Kwik-invoice-0412.pdf · 2 pages
Bains-Foods-Oct.pdf · Over 20 MB · Replace
Do these 2 invoices add up?
1 file
Do these 2 invoices add up?
Yes. Together that is 40 kg.
Kwik: 25 kg · Bains: 15 kg
Yes, the invoices look right.
Writing and accessibility
- Say why a file failed and what to do, in 1 line: "Over 20 MB · not added · Replace".
- Show the file's real name, cut in the middle if it is long, never only "Document 1".
- Give useful size facts: "2 pages", "214 rows", not only "180 KB".
- Tell people the limits where they add files: how many, how big, which types.
- Announce each change in the polite status region (the part of the page a screen reader announces on its own): "Kwik-invoice-0412.pdf attached", "Bains-Foods-Oct.pdf is too big".
- Each remove button is named with the file: "Remove Kwik-invoice-0412.pdf".
- Drag and drop always has a button that does the same thing.
- Don't show a failed upload by colour alone - use an icon and words.
Seen in real products
- ClaudeWeb, desktop and mobile · Nov 2026Files are added with the "+" button in the lower left of the chat box, by drag and drop, or by pasting images. Up to 20 files per chat, 500 MB each.Claude Help: Uploading files to Claude ↗
- Gemini AppsWeb · Nov 2026Add files in the text box offers upload from the device, Google Drive, a code folder or notebooks. Up to 10 files per prompt.Gemini Apps Help: Upload & analyze files ↗
- Copilot on WindowsWindows · Nov 2025A "+" in the composer attaches a file or a whole folder for Copilot Actions to work on.Windows Insider Blog, 17 Nov 2025 ↗
Each example comes from the product’s help pages, release notes or teardowns, with the month it was checked. Products change every month - tell us when 1 is out of date.
Check yourself
Seen this pattern done better, or a product that changed? Press Suggest next to any heading, or tell us about the whole page.