​
Imagen

Las imágenes son la forma más común de agregar contenido visual a tu documentación.

​
Conceptos básicos

Lamarkdown syntaxte permite agregar imágenes usando el siguiente código

![title](/path/image.jpg)

Para asegurarte de que las imágenes se muestren correctamente en producción, agrega una barra diagonal al principio de la ruta de la imagen (por ejemplo,/path/image.jpg).

Ten en cuenta que el tamaño del archivo de imagen debe ser menor de 20MB. De lo contrario, recomendamos alojarlo en un proveedor de CDN comoS3,Cloudinaryo un servicio similar.

​
Incrustaciones

Para obtener más personalización con las imágenes, también puedes usar incrustaciones para agregar imágenes.

<img height="200" src="/path/image.jpg" />

​
Deshabilitar el zoom de imagen

Para deshabilitar el zoom predeterminado al hacer clic en las imágenes, agrega la propiedad noZoom a las incrustaciones de imágenes.

<img height="200" noZoom src="/path/image.jpg" />

​
Enlazar imágenes

Para enlazar una imagen, por ejemplo, para crear un botón en tus documentos, envuelve la imagen en un enlace con lanoZoompropiedad. Las imágenes enaetiquetas tendrán automáticamente un cursor de puntero.

<a href="https://mintlify.com" target="_blank">
  <img height="200" noZoom src="/path/image.jpg" />
</a>

​
Modo oscuro

Para usar imágenes separadas para el modo claro y oscuro, utiliza Tailwind CSS para ocultar y mostrar imágenes.

<img className="block dark:hidden" src="/path/image-light.jpg" />
<img className="hidden dark:block" src="/path/image-dark.jpg" />

​
Relacionado

Para más información, recomendamos las siguientes secciones:

Referencia del componente Frame

Lee la referencia para el componente Frame

​
Videos


Mintlify admiteHTML tags in Markdown. Esto es útil si prefieres las etiquetas HTML a la sintaxis de Markdown, y te permite crear documentación con flexibilidad infinita.

Para videos de YouTube, usa:

<iframe
  width="560"
  height="315"
  src="https://www.youtube.com/embed/4KzFe50RQkQ"
  title="YouTube video player"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
  allowfullscreen
></iframe>

Para otros videos, usa:

<video
  controls
  className="w-full aspect-video"
  src="link-to-your-video.com"
></video>

Para reproducir automáticamente el video, usa:

<video
  autoPlay
  muted
  loop
  playsInline
  className="w-full aspect-video"
  src="link-to-your-video.com"
></video>

Dado que Mintlify necesita adherirse a la sintaxis JSX, los atributos de doble palabra deberán escribirse en camelCase: autoPlay, playsInline.

​
iFrames

Carga otra página HTML dentro del documento.

<iframe src="https://www.youtube.com/embed/4KzFe50RQkQ"> </iframe>