Images and visual content help make your documentation more engaging and easier to understand. Mintlify supports multiple ways to add images and embed media.
Images
You can add images using markdown syntax or HTML for more customization options.Using markdown
The markdown syntax lets you add images using the following code:The image file size must be less than 5MB. Otherwise, we recommend hosting on a service like Cloudinary or S3.
Using HTML embeds
To get more customizability with images, you can also use HTML<img> tags to add images with custom styling:
- Basic image
- Custom size
- Rounded corners
Image hosting
For larger images or better performance, consider using a CDN or cloud storage service:Recommended hosting services
- Cloudinary - Image optimization and CDN
- AWS S3 - Scalable cloud storage
- Imgur - Simple image hosting
- GitHub - Host images in your repository
Embeds and HTML elements
Mintlify supports HTML tags in Markdown. This is helpful if you prefer HTML tags to Markdown syntax, and lets you create documentation with infinite flexibility.
iFrames
Loads another HTML page within the document. Most commonly used for embedding videos.Best practices
- Performance
- Accessibility
- Styling
- Keep image file sizes under 5MB
- Use appropriate image formats (JPEG for photos, PNG for graphics)
- Consider using WebP for better compression
- Host large images on a CDN