Add clarification about using / for image paths relative to fern folder root (#1627)

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Devin Logan <[email protected]>

Author: devin-ai-integration[bot]

fern/products/docs/pages/component-library/writing-content/markdown.mdx

@@ -69,15 +69,27 @@ Read the [Introduction](/learn/overview/introduction).
 
 You can use locally stored images or URLs to include images in your Markdown pages. Use either [Markdown syntax](https://www.markdownguide.org/basic-syntax/#images-1) or the [`<img>` HTML tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img) to insert the image.
 
+<Info title="Image paths">
+  You can reference images using paths relative to the page's location (using `./` or `../`) or relative to the `fern` folder root (using `/`). For example, an image at `fern/assets/images/logo.png` can be referenced from any page as `/assets/images/logo.png`.
+</Info>
+
 <Tabs>
   <Tab title="Markdown">
     ```markdown
-    ![Alt text](./path/to/image.png "Optional title")
+    <!-- Relative to page location -->
+    ![Alt text](../../assets/images/logo.png "Optional title")
+
+    <!-- Relative to fern folder root -->
+    ![Alt text](/assets/images/logo.png "Optional title")
     ```
   </Tab>
   <Tab title="HTML">
     ```html
-    <img src="../assets/images/overview.png" width="500px" height="auto" />
+    <!-- Relative to page location -->
+    <img src="../../assets/images/logo.png" width="500px" height="auto" />
+
+    <!-- Relative to fern folder root -->
+    <img src="/assets/images/logo.png" width="500px" height="auto" />
     ```
   </Tab>
 </Tabs>