diff --git a/package-lock.json b/package-lock.json
index 1123d1e..65747ba 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
 				"better-sqlite3": "^12.6.2",
 				"drizzle-orm": "^0.45.1",
 				"nanoid": "^5.1.6",
+				"svelte-gestures": "^5.2.2",
 				"svelte-persisted-store": "^0.12.0",
 				"tailwindcss": "^4.1.18",
 				"zod": "^4.3.6"
@@ -4722,6 +4723,12 @@
 				}
 			}
 		},
+		"node_modules/svelte-gestures": {
+			"version": "5.2.2",
+			"resolved": "https://registry.npmjs.org/svelte-gestures/-/svelte-gestures-5.2.2.tgz",
+			"integrity": "sha512-Y+chXPaSx8OsPoFppUwPk8PJzgrZ7xoDJKXeiEc7JBqyKKzXer9hlf8F9O34eFuAWB4/WQEvccACvyBplESL7A==",
+			"license": "MIT"
+		},
 		"node_modules/svelte-persisted-store": {
 			"version": "0.12.0",
 			"resolved": "https://registry.npmjs.org/svelte-persisted-store/-/svelte-persisted-store-0.12.0.tgz",
diff --git a/package.json b/package.json
index a1a10a9..8671ef7 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,7 @@
 		"better-sqlite3": "^12.6.2",
 		"drizzle-orm": "^0.45.1",
 		"nanoid": "^5.1.6",
+		"svelte-gestures": "^5.2.2",
 		"svelte-persisted-store": "^0.12.0",
 		"tailwindcss": "^4.1.18",
 		"zod": "^4.3.6"
diff --git a/src/lib/components/EntryCard.svelte b/src/lib/components/EntryCard.svelte
index 47b2360..7101d12 100644
--- a/src/lib/components/EntryCard.svelte
+++ b/src/lib/components/EntryCard.svelte
@@ -2,6 +2,7 @@
 	import type { Entry } from '$lib/server/db/schema';
 	import { enhance } from '$app/forms';
 	import { slide } from 'svelte/transition';
+	import { useSwipe, type SwipeCustomEvent } from 'svelte-gestures';
 
 	interface Props {
 		entry: Entry;
@@ -21,6 +22,41 @@
 	let saveTimeout: ReturnType<typeof setTimeout>;
 	let isSaving = $state(false);
 
+	// Swipe state
+	let swipeOffset = $state(0);
+	let isConfirmingDelete = $state(false);
+
+	function handleSwipe(event: SwipeCustomEvent) {
+		const { direction } = event.detail;
+		if (direction === 'left') {
+			isConfirmingDelete = true;
+		}
+	}
+
+	// Create swipe gesture using useSwipe hook
+	const swipeGesture = useSwipe(handleSwipe, () => ({
+		timeframe: 300,
+		minSwipeDistance: 60,
+		touchAction: 'pan-y'
+	}));
+
+	function cancelDelete() {
+		isConfirmingDelete = false;
+		swipeOffset = 0;
+	}
+
+	async function confirmDelete() {
+		const formData = new FormData();
+		formData.append('id', entry.id);
+
+		await fetch('?/delete', {
+			method: 'POST',
+			body: formData
+		});
+
+		window.location.reload();
+	}
+
 	async function debouncedSave() {
 		clearTimeout(saveTimeout);
 		saveTimeout = setTimeout(async () => {
@@ -64,163 +100,210 @@
 	}
 </script>
 
-<article class="p-4 border-b border-gray-100 md:border md:rounded-lg md:shadow-sm md:mb-3 bg-white">
-	<!-- Collapsed view - clickable header -->
-	<div class="flex items-start gap-3">
-		{#if entry.type === 'task'}
-			<form method="POST" action="?/toggleComplete" use:enhance>
-				<input type="hidden" name="id" value={entry.id} />
-				<button
-					type="submit"
-					class="w-6 h-6 rounded border-2 border-gray-300 flex items-center justify-center touch-target
-                 {entry.status === 'done' ? 'bg-green-500 border-green-500' : 'hover:border-gray-400'}"
-					aria-label={entry.status === 'done' ? 'Mark as incomplete' : 'Mark as complete'}
-				>
-					{#if entry.status === 'done'}
-						<svg
-							class="w-4 h-4 text-white"
-							fill="none"
-							stroke="currentColor"
-							viewBox="0 0 24 24"
-						>
-							<path
-								stroke-linecap="round"
-								stroke-linejoin="round"
-								stroke-width="2"
-								d="M5 13l4 4L19 7"
-							/>
-						</svg>
-					{/if}
-				</button>
-			</form>
-		{:else}
-			<span class="w-6 h-6 rounded-full bg-purple-100 flex items-center justify-center flex-shrink-0">
-				<span class="text-purple-600 text-xs font-medium">T</span>
-			</span>
-		{/if}
-
-		<!-- svelte-ignore a11y_no_static_element_interactions -->
-		<div
-			class="flex-1 min-w-0 cursor-pointer"
-			role="button"
-			tabindex="0"
-			onclick={toggleExpand}
-			onkeydown={handleKeydown}
-		>
-			<h3
-				class="font-medium text-gray-900 text-base md:text-lg {entry.status === 'done'
-					? 'line-through text-gray-400'
-					: ''}"
-			>
-				{entry.title || 'Untitled'}
-			</h3>
-			{#if !expanded}
-				<p
-					class="text-gray-600 text-sm md:text-base line-clamp-2 {entry.status === 'done'
-						? 'text-gray-400'
-						: ''}"
-				>
-					{entry.content}
-				</p>
-			{/if}
-		</div>
-
-		<div class="flex items-center gap-2">
-			{#if isSaving}
-				<span class="text-xs text-gray-400">Saving...</span>
-			{/if}
-			<span
-				class="text-xs px-2 py-1 rounded-full {entry.type === 'task'
-					? 'bg-blue-100 text-blue-700'
-					: 'bg-purple-100 text-purple-700'}"
-			>
-				{entry.type}
-			</span>
-			<button
-				type="button"
-				onclick={toggleExpand}
-				class="p-1 hover:bg-gray-100 rounded"
-				aria-label={expanded ? 'Collapse entry' : 'Expand entry'}
-			>
-				<svg
-					class="w-5 h-5 text-gray-400 transform transition-transform {expanded
-						? 'rotate-180'
-						: ''}"
-					fill="none"
-					stroke="currentColor"
-					viewBox="0 0 24 24"
-				>
-					<path
-						stroke-linecap="round"
-						stroke-linejoin="round"
-						stroke-width="2"
-						d="M19 9l-7 7-7-7"
-					/>
-				</svg>
-			</button>
-		</div>
+<div class="relative overflow-hidden">
+	<!-- Delete background revealed during swipe -->
+	<div
+		class="absolute inset-y-0 right-0 w-24 bg-red-500 flex items-center justify-center"
+		aria-hidden="true"
+	>
+		<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+			<path
+				stroke-linecap="round"
+				stroke-linejoin="round"
+				stroke-width="2"
+				d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
+			/>
+		</svg>
 	</div>
 
-	<!-- Expanded view - edit fields -->
-	{#if expanded}
-		<div transition:slide={{ duration: 200 }} class="mt-4 pl-9 space-y-3">
-			<div>
-				<label for="edit-title-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
-					>Title</label
-				>
-				<input
-					id="edit-title-{entry.id}"
-					bind:value={editTitle}
-					oninput={handleInput}
-					placeholder="Add a title..."
-					class="w-full px-3 py-2 border border-gray-200 rounded-lg text-base focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-				/>
-			</div>
-
-			<div>
-				<label for="edit-content-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
-					>Content</label
-				>
-				<textarea
-					id="edit-content-{entry.id}"
-					bind:value={editContent}
-					oninput={handleInput}
-					rows="4"
-					class="w-full px-3 py-2 border border-gray-200 rounded-lg text-base resize-y focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-				></textarea>
-			</div>
-
-			<div class="flex items-center justify-between">
-				<div>
-					<label for="edit-type-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
-						>Type</label
-					>
-					<select
-						id="edit-type-{entry.id}"
-						bind:value={editType}
-						onchange={handleInput}
-						class="px-3 py-2 border border-gray-200 rounded-lg text-base focus:outline-none focus:ring-2 focus:ring-blue-500"
-					>
-						<option value="thought">Thought</option>
-						<option value="task">Task</option>
-					</select>
-				</div>
-
-				<form method="POST" action="?/delete" use:enhance>
+	<!-- Swipeable entry card -->
+	<article
+		{...swipeGesture}
+		style="transform: translateX({swipeOffset}px); transition: {swipeOffset === 0
+			? 'transform 0.2s'
+			: 'none'}"
+		class="p-4 border-b border-gray-100 md:border md:rounded-lg md:shadow-sm md:mb-3 bg-white relative"
+	>
+		<!-- Collapsed view - clickable header -->
+		<div class="flex items-start gap-3">
+			{#if entry.type === 'task'}
+				<form method="POST" action="?/toggleComplete" use:enhance>
 					<input type="hidden" name="id" value={entry.id} />
 					<button
 						type="submit"
-						class="px-4 py-2 text-red-600 hover:bg-red-50 rounded-lg touch-target"
-						onclick={(e) => {
-							if (!confirm('Delete this entry?')) {
-								e.preventDefault();
-							}
-						}}
+						class="w-6 h-6 rounded border-2 border-gray-300 flex items-center justify-center touch-target
+                   {entry.status === 'done' ? 'bg-green-500 border-green-500' : 'hover:border-gray-400'}"
+						aria-label={entry.status === 'done' ? 'Mark as incomplete' : 'Mark as complete'}
 					>
-						Delete
+						{#if entry.status === 'done'}
+							<svg
+								class="w-4 h-4 text-white"
+								fill="none"
+								stroke="currentColor"
+								viewBox="0 0 24 24"
+							>
+								<path
+									stroke-linecap="round"
+									stroke-linejoin="round"
+									stroke-width="2"
+									d="M5 13l4 4L19 7"
+								/>
+							</svg>
+						{/if}
 					</button>
 				</form>
+			{:else}
+				<span
+					class="w-6 h-6 rounded-full bg-purple-100 flex items-center justify-center flex-shrink-0"
+				>
+					<span class="text-purple-600 text-xs font-medium">T</span>
+				</span>
+			{/if}
+
+			<!-- svelte-ignore a11y_no_static_element_interactions -->
+			<div
+				class="flex-1 min-w-0 cursor-pointer"
+				role="button"
+				tabindex="0"
+				onclick={toggleExpand}
+				onkeydown={handleKeydown}
+			>
+				<h3
+					class="font-medium text-gray-900 text-base md:text-lg {entry.status === 'done'
+						? 'line-through text-gray-400'
+						: ''}"
+				>
+					{entry.title || 'Untitled'}
+				</h3>
+				{#if !expanded}
+					<p
+						class="text-gray-600 text-sm md:text-base line-clamp-2 {entry.status === 'done'
+							? 'text-gray-400'
+							: ''}"
+					>
+						{entry.content}
+					</p>
+				{/if}
+			</div>
+
+			<div class="flex items-center gap-2">
+				{#if isSaving}
+					<span class="text-xs text-gray-400">Saving...</span>
+				{/if}
+				<span
+					class="text-xs px-2 py-1 rounded-full {entry.type === 'task'
+						? 'bg-blue-100 text-blue-700'
+						: 'bg-purple-100 text-purple-700'}"
+				>
+					{entry.type}
+				</span>
+				<button
+					type="button"
+					onclick={toggleExpand}
+					class="p-1 hover:bg-gray-100 rounded"
+					aria-label={expanded ? 'Collapse entry' : 'Expand entry'}
+				>
+					<svg
+						class="w-5 h-5 text-gray-400 transform transition-transform {expanded
+							? 'rotate-180'
+							: ''}"
+						fill="none"
+						stroke="currentColor"
+						viewBox="0 0 24 24"
+					>
+						<path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							stroke-width="2"
+							d="M19 9l-7 7-7-7"
+						/>
+					</svg>
+				</button>
 			</div>
 		</div>
+
+		<!-- Expanded view - edit fields -->
+		{#if expanded}
+			<div transition:slide={{ duration: 200 }} class="mt-4 pl-9 space-y-3">
+				<div>
+					<label for="edit-title-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
+						>Title</label
+					>
+					<input
+						id="edit-title-{entry.id}"
+						bind:value={editTitle}
+						oninput={handleInput}
+						placeholder="Add a title..."
+						class="w-full px-3 py-2 border border-gray-200 rounded-lg text-base focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					/>
+				</div>
+
+				<div>
+					<label for="edit-content-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
+						>Content</label
+					>
+					<textarea
+						id="edit-content-{entry.id}"
+						bind:value={editContent}
+						oninput={handleInput}
+						rows="4"
+						class="w-full px-3 py-2 border border-gray-200 rounded-lg text-base resize-y focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					></textarea>
+				</div>
+
+				<div class="flex items-center justify-between">
+					<div>
+						<label for="edit-type-{entry.id}" class="block text-sm font-medium text-gray-700 mb-1"
+							>Type</label
+						>
+						<select
+							id="edit-type-{entry.id}"
+							bind:value={editType}
+							onchange={handleInput}
+							class="px-3 py-2 border border-gray-200 rounded-lg text-base focus:outline-none focus:ring-2 focus:ring-blue-500"
+						>
+							<option value="thought">Thought</option>
+							<option value="task">Task</option>
+						</select>
+					</div>
+
+					<form method="POST" action="?/delete" use:enhance>
+						<input type="hidden" name="id" value={entry.id} />
+						<button
+							type="submit"
+							class="px-4 py-2 text-red-600 hover:bg-red-50 rounded-lg touch-target"
+							onclick={(e) => {
+								if (!confirm('Delete this entry?')) {
+									e.preventDefault();
+								}
+							}}
+						>
+							Delete
+						</button>
+					</form>
+				</div>
+			</div>
+		{/if}
+	</article>
+
+	<!-- Delete confirmation overlay -->
+	{#if isConfirmingDelete}
+		<div
+			class="absolute inset-0 bg-white/95 flex items-center justify-center gap-4 z-10"
+			transition:slide={{ duration: 150 }}
+		>
+			<button
+				onclick={cancelDelete}
+				class="px-4 py-2 text-gray-600 border border-gray-300 rounded-lg touch-target min-w-[44px] min-h-[44px]"
+			>
+				Cancel
+			</button>
+			<button
+				onclick={confirmDelete}
+				class="px-4 py-2 bg-red-600 text-white rounded-lg touch-target min-w-[44px] min-h-[44px]"
+			>
+				Delete
+			</button>
+		</div>
 	{/if}
-</article>
+</div>