This post is a visual reference for all image components available in MDX posts. Set published: true to preview it live.
PostImage — Basic full-width image
No caption, just the image at full column width.
CaptionImage — Image with caption
Always shows a caption below.
LayoutImage — Full (default)
Same as PostImage but supports an optional caption.
LayoutImage — Wide
Breaks out of the content column. Good for panoramic shots or diagrams.
LayoutImage — Left float
Image floats left, text wraps around the right.
This paragraph wraps around the image on desktop. On mobile it stacks vertically. You can write as much text here as needed and it will continue to flow alongside the image until it clears. Good for adding a human element to a longer section of prose without interrupting the reading flow.
LayoutImage — Right float
Same as left, but the image sits on the right side. Useful for alternating visual rhythm across a longer post. Text continues to wrap naturally.
LayoutImage — Split (two images side by side)