diff --git a/plan.md b/plan.md
index d32637b..b232c15 100644
--- a/plan.md
+++ b/plan.md
@@ -380,3 +380,17 @@
   - done: `package.json` に `npm run e2e`(ビルド→テスト) / `npm run e2e:serve`
     / `npm run wasm` を追加。`puppeteer-core` を devDependencies に追加。
   - done: リポジトリ内ランナーで E2E 全 15 項目パスを再確認。
+
+## TODO-Web09(GitHub Pages 白画面修正)
+
+- ユーザー報告: Pages 公開時に「Loading WASM module...」のまま白画面。
+- 原因: GitHub Pages はサブパス(例: `/coBroc/`)で配信されるが、Vite の
+  デフォルト `base: '/'` によりビルド後の index.html が絶対パス
+  (`/assets/index-*.js`)を参照し 404 → main.ts が実行されず白画面。
+- 修正:
+  - done: `vite.config.ts` に `base: './'` を設定(全アセットをページ相対に)。
+  - done: `web/e2e/run_e2e.mjs` をサブパス対応(`E2E_BASE_PATH` 環境変数)。
+  - done: `favicon.svg` を追加し 404(favicon.ico)を解消。
+- 検証:
+  - done: サブパス `/coBroc/` を再現し E2E 全 15 項目パス(実 WASM ロード確認)。
+  - done: ルート配信でも E2E 全 15 項目パス。
diff --git a/web/e2e/run_e2e.mjs b/web/e2e/run_e2e.mjs
index 1ae47c0..f6d9281 100644
--- a/web/e2e/run_e2e.mjs
+++ b/web/e2e/run_e2e.mjs
@@ -8,6 +8,9 @@
  *   npm run e2e          # dist をビルドしてから実行
  *   npm run e2e:serve    # ビルドせずに実行(dist が既にある場合)
  *
+ * サブパス検証(GitHub Pages は /<repo>/ で配信されるため):
+ *   E2E_BASE_PATH=/coBroc npm run e2e:serve
+ *
  * 事前準備: npm i -D puppeteer-core(システムの Chrome を使用)
  */
 
@@ -20,11 +23,16 @@ import { fileURLToPath } from 'url';
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const PORT = 17890;
 const DIST = join(__dirname, '..', 'dist');
+const BASE_PATH = process.env.E2E_BASE_PATH || ''; // 例: '/coBroc'
 
 const mime = { '.html':'text/html','.js':'text/javascript','.wasm':'application/wasm','.json':'application/json','.svg':'image/svg+xml' };
 
 const server = createServer((req, res) => {
-  let p = join(DIST, req.url === '/' ? '/index.html' : req.url.split('?')[0]);
+  let urlPath = req.url.split('?')[0];
+  if (BASE_PATH && urlPath.startsWith(BASE_PATH)) {
+    urlPath = urlPath.slice(BASE_PATH.length);
+  }
+  let p = join(DIST, urlPath === '/' || urlPath === '' ? '/index.html' : urlPath);
   if (!existsSync(p)) { res.writeHead(404); res.end(); return; }
   const ext = extname(p);
   res.writeHead(200, { 'Content-Type': mime[ext] || 'application/octet-stream' });
@@ -32,11 +40,12 @@ const server = createServer((req, res) => {
 });
 
 server.listen(PORT, async () => {
-  console.log(`static server on :${PORT}`);
+  const baseUrl = `http://localhost:${PORT}${BASE_PATH}/`;
+  console.log(`static server on :${PORT} (base path: ${BASE_PATH || '/'})`);
   const proc = spawn('node', ['e2e_test.mjs'], {
     cwd: __dirname,
     stdio: 'inherit',
-    env: { ...process.env, E2E_URL: `http://localhost:${PORT}/` },
+    env: { ...process.env, E2E_URL: baseUrl },
   });
   proc.on('close', (code) => {
     server.close();
diff --git a/web/index.html b/web/index.html
index 86412fe..8ab518e 100644
--- a/web/index.html
+++ b/web/index.html
@@ -3,6 +3,7 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
   <title>coBroc - Block Coding Game</title>
   <style>
     * { margin: 0; padding: 0; box-sizing: border-box; }
diff --git a/web/public/favicon.svg b/web/public/favicon.svg
new file mode 100644
index 0000000..a7fec12
--- /dev/null
+++ b/web/public/favicon.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="6" fill="#1a1a2e"/>
+  <polygon points="16,6 26,24 6,24" fill="#14A44D"/>
+  <circle cx="16" cy="18" r="3" fill="#2F80ED"/>
+</svg>
diff --git a/web/vite.config.ts b/web/vite.config.ts
index 843a9b1..b249ac6 100644
--- a/web/vite.config.ts
+++ b/web/vite.config.ts
@@ -2,6 +2,10 @@ import { defineConfig } from 'vite';
 
 export default defineConfig({
   root: '.',
+  // GitHub Pages はサブパス(例: /coBroc/)で配信されるため、相対パス指定。
+  // これによりビルド後のアセット参照(assets/*, coBrocWeb.js, coBrocWeb.wasm)が
+  // ルート起点ではなくページ相対になり、どのサブパスでも動作する。
+  base: './',
   build: {
     outDir: 'dist',
     target: 'es2022',