diff --git a/docs/2.guide/2.directory-structure/3.app-config.md b/docs/2.guide/2.directory-structure/3.app-config.md
index 2710b76fc1..e614d359f7 100644
--- a/docs/2.guide/2.directory-structure/3.app-config.md
+++ b/docs/2.guide/2.directory-structure/3.app-config.md
@@ -43,13 +43,15 @@ const appConfig = useAppConfig()
 console.log(appConfig.theme)
 ```
 
-<!-- TODO: Document module author for extension -->
-
 ### Manually Typing App Config
 
-Nuxt tries to automatically generate a typescript interface from provided app config.
+Nuxt tries to automatically generate a TypeScript interface from provided app config.
 
-It is also possible to type app config manually:
+It is also possible to type app config manually. There are two possible things you might want to type.
+
+#### Typing App Config Input
+
+`AppConfigInput` might be used by module authors who are declaring what valid _input_ options are when setting app config. This will not affect the type of `useAppConfig()`.
 
 ```ts [index.d.ts]
 declare module '@nuxt/schema' {
@@ -65,3 +67,28 @@ declare module '@nuxt/schema' {
 // It is always important to ensure you import/export something when augmenting a type
 export {}
 ```
+
+#### Typing App Config Output
+
+If you want to type the result of calling `useAppConfig()`, then you will want to extend `AppConfig`.
+
+::alert{type=warning}
+Be careful when typing `AppConfig` as you will overwrite the types Nuxt infers from your actually defined app config.
+::
+
+```ts [index.d.ts]
+declare module '@nuxt/schema' {
+  interface AppConfig {
+    // This will entirely replace the existing inferred `theme` property
+    theme: {
+      // You might want to type this value to add more specific types than Nuxt can infer,
+      // such as string literal types
+      primaryColor?: 'red' | 'blue'
+    }
+  }
+}
+
+// It is always important to ensure you import/export something when augmenting a type
+export {}
+```
+