diff --git a/src/lib/components/functional/ConversionPanel.svelte b/src/lib/components/functional/ConversionPanel.svelte
index 173cfc3..35165f3 100644
--- a/src/lib/components/functional/ConversionPanel.svelte
+++ b/src/lib/components/functional/ConversionPanel.svelte
@@ -4,43 +4,41 @@
 	import Panel from "../visual/Panel.svelte";
 	import Dropdown from "./Dropdown.svelte";
 	import Tooltip from "../visual/Tooltip.svelte";
+	import ProgressBar from "../visual/ProgressBar.svelte";
+	import { fade } from "$lib/animation";
+
+	const length = $derived(files.files.length);
+	const progress = $derived(files.files.filter((f) => f.result).length);
 </script>
 
-<Panel
-	class="w-full h-auto flex items-center justify-between flex-col md:flex-row gap-4"
->
-	<div class="flex items-center flex-col md:flex-row gap-2.5 max-md:w-full">
-		<button
-			onclick={() => files.convertAll()}
-			class="btn {$effects
-				? ''
-				: '!scale-100'} highlight flex gap-3 max-md:w-full"
-			disabled={!files.ready}
+<Panel class="flex flex-col gap-4">
+	<div
+		class="w-full h-auto flex items-center justify-between flex-col md:flex-row gap-4"
+	>
+		<div
+			class="flex items-center flex-col md:flex-row gap-2.5 max-md:w-full"
 		>
-			<RefreshCw size="24" />
-			<p>Convert all</p>
-		</button>
-		<button
-			class="btn {$effects ? '' : '!scale-100'} flex gap-3 max-md:w-full"
-			disabled={!files.ready || !files.results}
-			onclick={() => files.downloadAll()}
-		>
-			<FolderArchiveIcon size="24" />
-			<p>Download all as .zip</p>
-		</button>
-		{#if $isMobile}
 			<button
-				class="btn p-4 {$effects
+				onclick={() => files.convertAll()}
+				class="btn {$effects
+					? ''
+					: '!scale-100'} highlight flex gap-3 max-md:w-full"
+				disabled={!files.ready}
+			>
+				<RefreshCw size="24" />
+				<p>Convert all</p>
+			</button>
+			<button
+				class="btn {$effects
 					? ''
 					: '!scale-100'} flex gap-3 max-md:w-full"
-				disabled={files.files.length === 0}
-				onclick={() => (files.files = [])}
+				disabled={!files.ready || !files.results}
+				onclick={() => files.downloadAll()}
 			>
-				<Trash2Icon size="24" />
-				<p>Remove all files</p>
+				<FolderArchiveIcon size="24" />
+				<p>Download all as .zip</p>
 			</button>
-		{:else}
-			<Tooltip text="Remove all files" position="right">
+			{#if $isMobile}
 				<button
 					class="btn p-4 {$effects
 						? ''
@@ -49,28 +47,53 @@
 					onclick={() => (files.files = [])}
 				>
 					<Trash2Icon size="24" />
+					<p>Remove all files</p>
 				</button>
-			</Tooltip>
-		{/if}
-	</div>
-	<div class="w-full bg-separator h-0.5 flex md:hidden"></div>
-	<div class="flex items-center gap-2">
-		<p class="whitespace-nowrap text-xl">Set all to</p>
-		{#if files.requiredConverters.length === 1}
-			<!-- cannot convert to svg or heif -->
-			{@const supported = files.files[0]?.converters
-				.flatMap((c) => c.supportedFormats)
-				?.filter((format) => format !== ".svg" && format !== ".heif")}
-			<Dropdown
-				onselect={(r) =>
-					files.files.forEach((f) => {
-						f.to = r;
-						f.result = null;
-					})}
-				options={supported || []}
-			/>
-		{:else}
-			<Dropdown options={["N/A"]} disabled />
-		{/if}
+			{:else}
+				<Tooltip text="Remove all files" position="right">
+					<button
+						class="btn p-4 {$effects
+							? ''
+							: '!scale-100'} flex gap-3 max-md:w-full"
+						disabled={files.files.length === 0}
+						onclick={() => (files.files = [])}
+					>
+						<Trash2Icon size="24" />
+					</button>
+				</Tooltip>
+			{/if}
+		</div>
+		<div class="w-full bg-separator h-0.5 flex md:hidden"></div>
+		<div class="flex items-center gap-2">
+			<p class="whitespace-nowrap text-xl">Set all to</p>
+			{#if files.requiredConverters.length === 1}
+				<!-- cannot convert to svg or heif -->
+				{@const supported = files.files[0]?.converters
+					.flatMap((c) => c.supportedFormats)
+					?.filter(
+						(format) => format !== ".svg" && format !== ".heif",
+					)}
+				<Dropdown
+					onselect={(r) =>
+						files.files.forEach((f) => {
+							f.to = r;
+							f.result = null;
+						})}
+					options={supported || []}
+				/>
+			{:else}
+				<Dropdown options={["N/A"]} disabled />
+			{/if}
+		</div>
 	</div>
+	{#if files.files.length > 50}
+		<div class="w-full px-2 flex gap-4 items-center">
+			<div class="flex-shrink-0 -mt-0.5 font-normal text-sm text-muted">
+				{progress}/{length}
+			</div>
+			<div class="flex-grow">
+				<ProgressBar min={0} max={length} {progress} />
+			</div>
+		</div>
+	{/if}
 </Panel>
diff --git a/src/lib/store/index.svelte.ts b/src/lib/store/index.svelte.ts
index aa64a95..104fd36 100644
--- a/src/lib/store/index.svelte.ts
+++ b/src/lib/store/index.svelte.ts
@@ -23,43 +23,49 @@ class Files {
 		this.files.length === 0 ? false : this.files.every((f) => f.result),
 	);
 
-	private _addThumbnail = async (file: VertFile) => {
-		const isAudio = converters
-			.find((c) => c.name === "ffmpeg")
-			?.supportedFormats?.includes(file.from.toLowerCase());
-		const isVideo = converters
-			.find((c) => c.name === "vertd")
-			?.supportedFormats?.includes(file.from.toLowerCase());
+	private thumbnailQueue = new PQueue({
+		concurrency: navigator.hardwareConcurrency || 4,
+	});
 
-		try {
-			if (isAudio) {
-				// try to get the thumbnail from the audio via music-metadata
-				const { common } = await parseBlob(file.file, {
-					skipPostHeaders: true,
-				});
-				const cover = selectCover(common.picture);
-				if (cover) {
-					const blob = new Blob([cover.data], {
-						type: cover.format,
+	private _addThumbnail = async (file: VertFile) => {
+		this.thumbnailQueue.add(async () => {
+			const isAudio = converters
+				.find((c) => c.name === "ffmpeg")
+				?.supportedFormats?.includes(file.from.toLowerCase());
+			const isVideo = converters
+				.find((c) => c.name === "vertd")
+				?.supportedFormats?.includes(file.from.toLowerCase());
+
+			try {
+				if (isAudio) {
+					// try to get the thumbnail from the audio via music-metadata
+					const { common } = await parseBlob(file.file, {
+						skipPostHeaders: true,
 					});
-					file.blobUrl = URL.createObjectURL(blob);
+					const cover = selectCover(common.picture);
+					if (cover) {
+						const blob = new Blob([cover.data], {
+							type: cover.format,
+						});
+						file.blobUrl = URL.createObjectURL(blob);
+					}
+				} else if (isVideo) {
+					// video
+					file.blobUrl = await this._generateThumbnailFromMedia(
+						file.file,
+						true,
+					);
+				} else {
+					// image
+					file.blobUrl = await this._generateThumbnailFromMedia(
+						file.file,
+						false,
+					);
 				}
-			} else if (isVideo) {
-				// video
-				file.blobUrl = await this._generateThumbnailFromMedia(
-					file.file,
-					true,
-				);
-			} else {
-				// image
-				file.blobUrl = await this._generateThumbnailFromMedia(
-					file.file,
-					false,
-				);
+			} catch (e) {
+				error(["files"], e);
 			}
-		} catch (e) {
-			error(["files"], e);
-		}
+		});
 	};
 
 	private async _generateThumbnailFromMedia(
diff --git a/src/lib/types/file.svelte.ts b/src/lib/types/file.svelte.ts
index f6ac1f3..a8b8b4d 100644
--- a/src/lib/types/file.svelte.ts
+++ b/src/lib/types/file.svelte.ts
@@ -29,7 +29,6 @@ export class VertFile {
 		const converter = this.converters.filter((converter) =>
 			converter.supportedFormats.map((f) => supportedFormats.includes(f)),
 		);
-		console.log(this.converters, supportedFormats);
 		return converter;
 	}