diff --git a/package.json b/package.json
index 7cff6849..4ba6b1bd 100644
--- a/package.json
+++ b/package.json
@@ -37,6 +37,7 @@
   },
   "main": "dist/node/index.js",
   "types": "types/index.d.ts",
+  "web-types": "./dist/web-types.json",
   "bin": {
     "vitepress": "bin/vitepress.js"
   },
@@ -58,7 +59,7 @@
     "dev:node": "DEV=true pnpm build:node -w",
     "dev:shared": "node scripts/copyShared.ts",
     "dev:watch": "node scripts/watchAndCopy.ts",
-    "build": "pnpm build:prepare && pnpm build:client && pnpm build:node",
+    "build": "pnpm build:prepare && pnpm build:client && pnpm build:node && node scripts/genWebTypes.ts",
     "build:prepare": "pnpm clean && node scripts/copyShared.ts",
     "build:client": "vue-tsc --noEmit -p src/client && tsc -p src/client && node scripts/copyClient.ts",
     "build:node": "tsc -p src/node --noEmit && rollup --config rollup.config.ts --configPlugin esbuild",
diff --git a/scripts/genWebTypes.ts b/scripts/genWebTypes.ts
new file mode 100644
index 00000000..ce372f4e
--- /dev/null
+++ b/scripts/genWebTypes.ts
@@ -0,0 +1,78 @@
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs'
+
+const { version } = JSON.parse(readFileSync('package.json', 'utf-8'))
+
+const webTypes = {
+  $schema: 'http://json.schemastore.org/web-types',
+  framework: 'vue',
+  name: 'vitepress',
+  version,
+  'js-types-syntax': 'typescript',
+  'description-markup': 'markdown',
+  contributions: {
+    html: {
+      'vue-components': [
+        {
+          name: 'Content',
+          source: { symbol: 'Content' },
+          description:
+            'Displays the rendered markdown contents. Useful when creating your own theme.',
+          'doc-url': 'https://vitepress.dev/reference/runtime-api#content',
+          props: [
+            {
+              name: 'as',
+              description:
+                'The content wrapper. Accepts an HTML tag name, a component name, or a component reference.',
+              type: ['string', 'object'],
+              default: 'div'
+            }
+          ]
+        },
+        {
+          name: 'ClientOnly',
+          source: { symbol: 'ClientOnly' },
+          description:
+            'Renders its slot only at client side. Useful for wrapping components that are not SSR-friendly.',
+          'doc-url': 'https://vitepress.dev/reference/runtime-api#clientonly',
+          slots: [
+            {
+              name: 'default',
+              description: 'Content to render once the client app is mounted.'
+            }
+          ]
+        },
+        {
+          name: 'Badge',
+          source: { module: 'vitepress/theme', symbol: 'VPBadge' },
+          description:
+            "Adds a status label to headers, such as a section's type or supported version. Available when using the default theme.",
+          'doc-url': 'https://vitepress.dev/reference/default-theme-badge',
+          props: [
+            {
+              name: 'type',
+              description: 'The badge color type.',
+              type: "'info' | 'tip' | 'warning' | 'danger'",
+              default: 'tip'
+            },
+            {
+              name: 'text',
+              description:
+                'The text displayed inside the badge. Ignored when the default slot is passed.',
+              type: 'string'
+            }
+          ],
+          slots: [
+            {
+              name: 'default',
+              description:
+                'Content displayed inside the badge. Takes precedence over the `text` prop.'
+            }
+          ]
+        }
+      ]
+    }
+  }
+}
+
+mkdirSync('dist', { recursive: true })
+writeFileSync('dist/web-types.json', JSON.stringify(webTypes, null, 2) + '\n')