Overview

This page demonstrates all link and image patterns supported in Markdown/MDX content.

Link Types

Inline Links

• External link — links to an external site
• Internal link — links to another docs page
• Anchor link — links to a heading on this page
• Link with title — has a tooltip

Reference Links

Here is a paragraph with reference-style links and another one.

Autolinks

• Full URL: https://example.com
• Email: user@example.com

Links with Formatting

• Bold link
• Italic link
• Code link

Images

Basic Image

Images in Markdown:

![Alt text](https://via.placeholder.com/600x200/6366f1/ffffff?text=Placeholder+Image)

Image with Title

![Alt text](url "Image title shown on hover")

Linked Image

[![Alt text](image-url)](link-url)

External Link Behavior

External links in the framework:

• The external icon from the icon set can indicate external links
• The SocialIcons component opens all links in new tabs
• The EditLink component uses target="_blank" and rel="noopener noreferrer"

Anchor Links (AnchorHeading)

Every heading on this page has an auto-generated anchor link. The AnchorHeading component:

1. Wraps the heading content in a <div> with role="heading"
2. Adds an id attribute for deep linking
3. Renders a hidden anchor icon that appears on hover
4. The anchor label defaults to "Section titled [heading text]"

Props

Prop	Type	Description
level	number	Heading level (1-6)
id	string	Anchor ID for deep linking
html	string	Heading content as HTML string
anchorLabel	string	Accessible label for the anchor link