Go back

Embedded Content

18 Jul 2025

Salman Alfarisi

Fullstack Engineer

Intro

MDX combines Markdown and JSX, letting you embed interactive or styled content like music players, videos, or GitHub previews directly in your posts.

This shows a couple of <iframe> elements using custom components and tailwind classes.

You can embed songs or albums from iMusic using <iframe> elements. These are fully responsive and preserve Apple's design principle.

Keep in mind, <iframe> may behave inconsistently across browsers or themes, please use accordingly.

To embed a YouTube video, use a simple <iframe> with a fixed aspect-ratio and the video URL:

You can adjust the width and height to match your layout needs.

For showcasing repositories, MDX + custom components can help you with that.

Maybe you need to show your GitHub stats? You can use a custom component for that as well.

These components can be anything you want, a GitHub card, a file explorer, or live stats. Only limited by your creativity and capacity.