diff --git a/web/src/lib/components/repo/BlobView.svelte b/web/src/lib/components/repo/BlobView.svelte
index 734b981fe..b364f6270 100644
--- a/web/src/lib/components/repo/BlobView.svelte
+++ b/web/src/lib/components/repo/BlobView.svelte
@@ -1,11 +1,15 @@
 <script lang="ts">
 	import { untrack } from "svelte";
+	import type { SelectedLineRange } from "@pierre/diffs";
+	import { goto } from "$app/navigation";
+	import { page } from "$app/state";
 	import type { ResolvedPathname } from "$app/types";
 	import { hasTextView, type BlobKind, type RepoBlobView } from "#lib/api/blob.ts";
 	import BlobHeader from "#lib/components/repo/BlobHeader.svelte";
 	import { languageForPath } from "#lib/components/repo/languageColors.ts";
 	import LastCommitPanel from "#lib/components/repo/LastCommitPanel.svelte";
 	import PierreFile from "#lib/components/repo/PierreFile.svelte";
+	import { lineAnchor, parseLineAnchor } from "#lib/components/repo/lineAnchor.ts";
 	import { baseName, fileHistoryHref } from "#lib/components/repo/urls.ts";
 	import { createBlame, type BlameSource } from "#lib/components/repo/blame/request.svelte.ts";
 	import Separator from "#lib/components/ui/Separator.svelte";
@@ -97,9 +101,35 @@
 		overflows = scroller ? scroller.scrollWidth > scroller.clientWidth : false;
 	};
 
+	let selectedLines = $derived(parseLineAnchor(page.url.hash));
+	let landed: string | undefined;
+	const landing = (): string => `${blob.path}${lineAnchor(selectedLines)}`;
+
+	const selectLines = (range: SelectedLineRange | null): void => {
+		selectedLines = range;
+		landed = landing();
+		// eslint-disable-next-line svelte/no-navigation-without-resolve
+		void goto(`${location.pathname}${location.search}${lineAnchor(range)}`, {
+			shallow: true,
+			replace: true,
+			state: page.state
+		});
+	};
+
+	const scrollToSelection = (node: HTMLElement): void => {
+		if (!selectedLines || landed === landing()) return;
+		landed = landing();
+		node.shadowRoot
+			?.querySelector(`[data-line="${selectedLines.start}"]`)
+			?.scrollIntoView({ block: "center" });
+	};
+
 	// rAF races pierre's async shiki pass, the measurement happens in
 	// pierre's own post-render hook
-	const onPostRender = (node: HTMLElement) => measure(node);
+	const onPostRender = (node: HTMLElement) => {
+		measure(node);
+		scrollToSelection(node);
+	};
 
 	// sveltekit reuses this component across [...path] navigations, drop the
 	// previous file's measurement before pierre reports the new one
@@ -209,6 +239,8 @@
 				{wrap}
 				{onPostRender}
 				blame={blame ? blameRequest.runs : undefined}
+				{selectedLines}
+				onLineSelected={selectLines}
 			/>
 		</div>
 	{:else}
diff --git a/web/src/lib/components/repo/PierreFile.svelte b/web/src/lib/components/repo/PierreFile.svelte
index 6ce7a801f..43e6ab8f4 100644
--- a/web/src/lib/components/repo/PierreFile.svelte
+++ b/web/src/lib/components/repo/PierreFile.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { untrack } from "svelte";
-	import { File, type FileOptions } from "@pierre/diffs";
+	import { File, type FileOptions, type SelectedLineRange } from "@pierre/diffs";
 	import { browser } from "$app/env";
 	import {
 		clearPierreRender,
@@ -21,9 +21,19 @@
 		onPostRender?: FileOptions<undefined, undefined>["onPostRender"];
 		// one run per stretch of lines sharing a commit, absent when blame is off
 		blame?: Blame;
+		selectedLines?: SelectedLineRange | null;
+		onLineSelected?: (range: SelectedLineRange | null) => void;
 	}
 
-	let { name, contents, wrap = false, onPostRender, blame }: Props = $props();
+	let {
+		name,
+		contents,
+		wrap = false,
+		onPostRender,
+		blame,
+		selectedLines = null,
+		onLineSelected
+	}: Props = $props();
 
 	let element: HTMLElement | undefined = $state();
 	let wrapper: HTMLElement | undefined = $state();
@@ -33,6 +43,8 @@
 	const options = (forWrap: boolean): FileOptions<undefined, undefined> => ({
 		...pierreFileOptions(forWrap),
 		onPostRender,
+		enableLineSelection: onLineSelected !== undefined,
+		onLineSelected: (range) => onLineSelected?.(range),
 		onLineEnter: ({ lineNumber, lineElement, event }) => {
 			if (!blame || event.pointerType === "touch") return;
 			hover.enter(lineNumber, lineElement);
@@ -57,9 +69,9 @@
 		if (!dehydrated) clearPierreRender(host);
 		const created = new File(options(wrap), undefined, true);
 		// untracked, the render effect below owns updates
-		created.hydrate({
-			file: untrack(() => ({ name, contents })),
-			fileContainer: host
+		untrack(() => {
+			created.hydrate({ file: { name, contents }, fileContainer: host });
+			created.setSelectedLines(selectedLines, { notify: false });
 		});
 		instance = created;
 
@@ -78,7 +90,12 @@
 			firstRender = false;
 			return;
 		}
-		instance?.render({ file, forceRender: true });
+		untrack(() => instance?.render({ file, forceRender: true }));
+	});
+
+	$effect(() => {
+		const range = selectedLines;
+		instance?.setSelectedLines(range, { notify: false });
 	});
 </script>
 
@@ -87,7 +104,7 @@
 		data-testid="fileContents"
 		data-filename={name}
 		bind:this={element}
-		class="diffs-container"
+		class="diffs-container [--diffs-gap-style:none] [--diffs-selection-base:var(--color-indigo-500)]"
 	>
 		{#if !browser}
 			{@const prerenderedHTML = await prerenderFile(name, contents)}
diff --git a/web/src/lib/components/repo/lineAnchor.test.ts b/web/src/lib/components/repo/lineAnchor.test.ts
new file mode 100644
index 000000000..26d839a00
--- /dev/null
+++ b/web/src/lib/components/repo/lineAnchor.test.ts
@@ -0,0 +1,29 @@
+import { describe, expect, it } from "vitest";
+import { lineAnchor, parseLineAnchor } from "#lib/components/repo/lineAnchor.ts";
+
+describe("parseLineAnchor", () => {
+	it("reads one line and a range", () => {
+		expect(parseLineAnchor("#L12")).toEqual({ start: 12, end: 12 });
+		expect(parseLineAnchor("#L12-20")).toEqual({ start: 12, end: 20 });
+		expect(parseLineAnchor("#L12-L20")).toEqual({ start: 12, end: 20 });
+	});
+
+	it("orders a backwards range", () => {
+		expect(parseLineAnchor("#L20-12")).toEqual({ start: 12, end: 20 });
+	});
+
+	it("ignores anything else", () => {
+		expect(parseLineAnchor("")).toBeNull();
+		expect(parseLineAnchor("#L0")).toBeNull();
+		expect(parseLineAnchor("#readme")).toBeNull();
+		expect(parseLineAnchor("#L12-")).toBeNull();
+	});
+});
+
+describe("lineAnchor", () => {
+	it("writes one line and a range", () => {
+		expect(lineAnchor({ start: 7, end: 7 })).toBe("#L7");
+		expect(lineAnchor({ start: 20, end: 12 })).toBe("#L12-20");
+		expect(lineAnchor(null)).toBe("");
+	});
+});
diff --git a/web/src/lib/components/repo/lineAnchor.ts b/web/src/lib/components/repo/lineAnchor.ts
new file mode 100644
index 000000000..a1bf1a397
--- /dev/null
+++ b/web/src/lib/components/repo/lineAnchor.ts
@@ -0,0 +1,19 @@
+import type { SelectedLineRange } from "@pierre/diffs";
+
+const LINE_ANCHOR_RE = /^#L(\d+)(?:-L?(\d+))?$/;
+
+export const parseLineAnchor = (hash: string): SelectedLineRange | null => {
+	const match = LINE_ANCHOR_RE.exec(hash);
+	if (!match) return null;
+	const first = Number(match[1]);
+	const last = match[2] === undefined ? first : Number(match[2]);
+	if (first < 1 || last < 1) return null;
+	return { start: Math.min(first, last), end: Math.max(first, last) };
+};
+
+export const lineAnchor = (range: SelectedLineRange | null): string => {
+	if (!range) return "";
+	const start = Math.min(range.start, range.end);
+	const end = Math.max(range.start, range.end);
+	return start === end ? `#L${start}` : `#L${start}-${end}`;
+};