diff --git a/docs/data/skills.data.js b/docs/data/skills.data.js
index 94e842b6de..99b6c48818 100644
--- a/docs/data/skills.data.js
+++ b/docs/data/skills.data.js
@@ -1,5 +1,5 @@
 import { readdirSync, readFileSync } from "fs";
-import { join } from "path";
+import { join, relative } from "path";
 import { fileURLToPath } from "url";
 import { dirname } from "path";
 
@@ -38,6 +38,7 @@ function parseFrontmatter(content) {
 export default {
   async load() {
     const skillsDir = join(__dirname, "../../.claude/skills");
+    const repoRoot = join(__dirname, "../..");
     const skills = [];
     
     try {
@@ -56,6 +57,7 @@ export default {
             name: frontmatter.name || skillDir,
             description: frontmatter.description || "",
             content: body,
+            skillPath: relative(repoRoot, skillPath).replaceAll("\\", "/"),
             path: skillPath,
           });
         } catch (err) {
diff --git a/docs/skills.vue b/docs/skills.vue
index cee55ca366..5048382cf5 100644
--- a/docs/skills.vue
+++ b/docs/skills.vue
@@ -5,7 +5,7 @@
         <div class="skills-list">
             <div v-for="skill in skills" :key="skill.id" class="skill-card">
                 <a
-                    :href="`https://github.com/longbridge/gpui-component/tree/main/skills/${skill.id}/SKILL.md`"
+                    :href="`https://github.com/longbridge/gpui-component/tree/main/${skill.skillPath}`"
                     target="_blank"
                     class="skill-link"
                 >