Hi @Brown bear, in the context of Next.js and MDX files, there are two common methods to display images I am aware of:

1. Moving Your Image to the Public Folder:
- Place your images in the public folder of your Next.js project.
- Reference these images directly by their path relative to the public directory.
- For example, if you have an image named example.jpg in the public/images folder, you can reference it in your MDX file as ![Alt Text](/images/example.jpg).

2. Importing from a React Component:
- You can create a React component to handle the image and then import this component into your MDX file.
- Here's an example:

page.mdx:

import TestImage from './TestImage.tsx'

Hello World

<TestImage />

TestImage.tsx:

import Image from 'next/image'
import Test from './test.png'

export default function TestImage() {
  return <Image src={Test} alt="image" width="100" height="100" />
}

- In this example, TestImage.tsx is a React component that uses Next.js's Image component.