diff --git a/.changeset/wet-cats-allow.md b/.changeset/wet-cats-allow.md
index 5c642109b0..c3e79ac25a 100644
--- a/.changeset/wet-cats-allow.md
+++ b/.changeset/wet-cats-allow.md
@@ -2,4 +2,22 @@
 '@backstage/plugin-home': patch
 ---
 
-Added a new Featured Docs component to plugin-home, which can display any entity given a filter
+Added a new Featured Docs component to `plugin-home`, which can display any entity given a filter.
+
+```
+import { FeaturedDocs } from '@backstage/plugin-home';
+
+<FeaturedDocs
+  filter={{
+    'spec.type': 'documentation',
+    'metadata.name': 'getting-started-with-backstage',
+  }}
+  title={cardTitleReactNode}
+  customStyles={styles}
+  subLinkText="More Details"
+  color="secondary"
+  emptyState={emptyStateReactNode}
+/>
+```
+
+See the [storybook examples](https://backstage.io/storybook/?path=/story/plugins-home-components-featureddocs--default)
diff --git a/plugins/home/src/plugin.ts b/plugins/home/src/plugin.ts
index d4ee89b707..ca024faabd 100644
--- a/plugins/home/src/plugin.ts
+++ b/plugins/home/src/plugin.ts
@@ -19,6 +19,7 @@ import {
   createComponentExtension,
   createPlugin,
   createRoutableExtension,
+  createReactExtension,
   identityApiRef,
   storageApiRef,
 } from '@backstage/core-plugin-api';
@@ -217,7 +218,7 @@ export const HomePageRecentlyVisited = homePlugin.provide(
  * @public
  */
 export const FeaturedDocs = homePlugin.provide(
-  createComponentExtension({
+  createReactExtension({
     name: 'FeaturedDocs',
     component: {
       lazy: () =>