diff --git a/IDEAS.md b/IDEAS.md
index 2dd9cef..2335550 100644
--- a/IDEAS.md
+++ b/IDEAS.md
@@ -1,4 +1,5 @@
 # Ideas
+
 Collect ideas to work on later
 
 - [ ] Drizzle with Turso: https://orm.drizzle.team/docs/get-started/turso-database-new
@@ -9,4 +10,4 @@ Collect ideas to work on later
     - https://docs.yjs.dev/
   - [ ] The server is just another client that can store data and sync with other clients. It just doesn't have a UI and interactivity. It can be used by other clients to get data when other clients are offline
     - [ ] Peer-to-peer networking with server as peer: https://www.iroh.computer/
-    - [ ] CRDT framework messages are wrapped inside MLS so that the server can not read the message contents: https://openmls.tech/
\ No newline at end of file
+    - [ ] CRDT framework messages are wrapped inside MLS so that the server can not read the message contents: https://openmls.tech/
diff --git a/package.json b/package.json
index 04bf5f3..e61cb65 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "flashcut",
-  "version": "0.0.0",
+  "version": "0.1.0",
   "private": true,
   "type": "module",
   "scripts": {
diff --git a/src/index.tsx b/src/index.tsx
index 57a8e7c..5a278b9 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,8 +1,8 @@
 import "./index.css";
 /* @refresh reload */
 import { Route, Router } from "@solidjs/router";
-import { lazy } from "solid-js";
 import { render } from "@solidjs/web";
+import { lazy } from "solid-js";
 
 // Keep the polyfill out of the main bundle: it is only fetched (as its own
 // chunk) when the browser lacks native Temporal.
diff --git a/src/pages/SettingsPage.tsx b/src/pages/SettingsPage.tsx
index 13f6cfd..1829555 100644
--- a/src/pages/SettingsPage.tsx
+++ b/src/pages/SettingsPage.tsx
@@ -108,6 +108,10 @@ export default function SettingsPage() {
       <Show when={status()}>
         <p class="text-sm text-teal-700 dark:text-teal-400">{status()}</p>
       </Show>
+
+      <p class="text-center text-xs text-stone-500">
+        Flashcut v{__APP_VERSION__} · build <span class="font-mono">{__GIT_COMMIT__}</span>
+      </p>
     </div>
   );
 }
@@ -117,7 +121,9 @@ function FilePicker(props: { label: string; accept: string; onFile: (file: File)
   return (
     <>
       <input
-        ref={fileInput}
+        ref={(el) => {
+          fileInput = el;
+        }}
         type="file"
         accept={props.accept}
         class="hidden"
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index a23700a..1d3f3da 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -7,6 +7,10 @@ declare global {
   interface Date {
     toTemporalInstant(this: Date): Temporal.Instant;
   }
+
+  // Build-time constants injected via `define` in vite.config.ts.
+  const __APP_VERSION__: string;
+  const __GIT_COMMIT__: string;
 }
 
 export {};
diff --git a/vite.config.ts b/vite.config.ts
index 6bfd6cb..8543d29 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,7 +1,22 @@
+import { execSync } from "node:child_process";
+import { readFileSync } from "node:fs";
+
 import tailwindcss from "@tailwindcss/vite";
 import { defineConfig } from "vite";
 import solid from "vite-plugin-solid";
 
+const { version } = JSON.parse(readFileSync(new URL("package.json", import.meta.url), "utf8")) as {
+  version: string;
+};
+
+function gitCommit(): string {
+  try {
+    return execSync("git rev-parse --short HEAD", { encoding: "utf8" }).trim();
+  } catch {
+    return "unknown";
+  }
+}
+
 // @tursodatabase/database-wasm uses SharedArrayBuffer, which requires cross-origin
 // isolation in dev AND production (see public/_headers for deployed hosts).
 const crossOriginIsolation = {
@@ -10,6 +25,10 @@ const crossOriginIsolation = {
 };
 
 export default defineConfig({
+  define: {
+    __APP_VERSION__: JSON.stringify(version),
+    __GIT_COMMIT__: JSON.stringify(gitCommit()),
+  },
   plugins: [solid(), tailwindcss()],
   server: { headers: crossOriginIsolation },
   preview: { headers: crossOriginIsolation },