# Images and Embeds

> Add image, video, and other HTML elements.

## Image

### Using Markdown

Display images using standard Markdown syntax. Markdown images are simple to implement for basic image display.

<code-preview>

![Nuxt Social Image](https://nuxt.com/new-social.jpg)



#undefined
```mdc
![Nuxt Social Image](https://nuxt.com/new-social.jpg)
```



</code-preview>

<note>

If [`@nuxt/image`](https://image.nuxt.com/get-started/installation){rel="[\"nofollow\"]"} is installed, the `<NuxtImg>` component will be used instead of the native `img` tag.



</note>

### Using Embeds

Use embeds for more image customization. Embeds offer greater control over image attributes like size and styling.

<code-preview>

![Nuxt Social Image](https://nuxt.com/new-social.jpg){height="150"}



#undefined
```mdc
:img{src="https://nuxt.com/new-social.jpg" alt="Nuxt Social Image" height="150"}
```



</code-preview>

## Embeds and HTML elements

Embeds allow adding various HTML elements like videos and iframes. This feature extends documentation capabilities to include interactive and multimedia content.

<code-preview className="[\"[&>div]:*:w-full\"]">
<iframe allowfullscreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" frameBorder="0" referrerPolicy="strict-origin-when-cross-origin" src="https://www.youtube-nocookie.com/embed/_eQxomah-nA?si=pDSzchUBDKb2NQu7" style="aspect-ratio: 16/9;" title="YouTube video player"></iframe>

#undefined
```mdc
:iframe{src="https://www.youtube-nocookie.com/embed/_eQxomah-nA?si=pDSzchUBDKb2NQu7" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="aspect-ratio: 16/9;"}
```



</code-preview>