Slide Thumbnail Grid

Upload slides and view them as a sortable thumbnail grid to plan presentation flow and order.

Tested tool guide Tested browser tools Checked August 16, 2026

What Slide Thumbnail Grid does, with a checked example

A slide sorter for the planning phase: drop in the slides of a deck as images and every one appears as a thumbnail in a grid you can drag into a new sequence. The point is to rearrange before you rebuild - to see the whole deck at a glance, spot a section that breaks the flow, and settle the order without opening an editor. The grid is a plan, not a file: nothing here rewrites your original slides. The surprise most users hit: the initial grid follows the order you selected the files in, which is rarely the order the deck actually plays.

Worked example

A concrete input and expected output from the current implementation.

Input

Six slide images selected in the file picker in this order: cover.png, agenda.png, method.png, results.png, discussion.png, thanks.png.

Expected output

A grid of six thumbnails reading cover, agenda, method, results, discussion, thanks. Dragging results ahead of method leaves the grid reading cover, agenda, results, method, discussion, thanks - six positions, with only the relative order of those two slides changed.

The grid starts in file-selection order, and the sortable sequence is exactly what you set: moving one thumbnail swaps the relative order of that slide and its neighbor while every other position stays put.

How the result is produced

Upload and preview

Each chosen file is read locally and rendered as a thumbnail with no server round-trip, so the grid appears the moment you finish selecting. The tool displays the image file you provide, nothing more: aspect ratio, crop and legibility all come from the export itself, so render your slides at the aspect ratio and resolution you intend to present before uploading.

Drag to reorder

Dragging a thumbnail into a new slot moves it in the sequence and the grid relayouts around it, left to right, top to bottom. The order on the grid is the only state that matters - it is the plan you take away. Nothing is written back to the source files: they keep their original names and order, so carry the final sequence into your presentation app when you rebuild.

Good uses

You inherited a deck whose flow is wrong: see all slides at once and drag whole sections into a better sequence before editing a single slide.
You are assembling a talk from loose slides taken from past decks and templates: lay every candidate out in one grid and decide which make the cut and in what order.
You need to trim a deck to fit a time limit: scan the full grid for near-duplicate slides, filler and sections you can cut, and settle the new order in one pass.

Limits and checks

The starting order is selection order, not filename or deck order. If you multi-select files in the picker, that is the sequence the grid shows; an unexpected layout usually means the files were selected in a different order, not a display bug.
Slides must be images. A .pptx, .key or .pdf dropped in will not split itself into per-slide thumbnails; export the deck as PNG or JPG files first, one image per slide.
The grid is a plan, not an edit. Reordering leaves the source files untouched, and the final sequence exists only in the grid, so keep the page open while you rebuild the deck or note the order elsewhere.

Common questions

Does the order I set here update my original presentation?

No. The grid is a planning view; nothing is written back to your slide files or to the deck they came from. The final sequence is the deliverable - rebuild your presentation following the grid order, or keep the grid open as a reference while you do.

Why are my slides in the wrong order when the grid first loads?

The grid preserves the order in which you selected the files in the picker, which browsers record as you click, not as the files sort on disk. Select files in the order you want them to appear, or reorder the grid afterwards with drag-and-drop.

References and verification

The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.