Markdown Toolbox Logo Markdown Toolbox
Home
Blog

Thumbnails and full size

2024-09-11

Short Version

To create a thumbnail that links to a full image in Markdown, use the following syntax:

[![Thumbnail Description](thumbnail-url)](full-image-url)

Long Version

Step-by-Step Instructions

Markdown allows you to easily link to images while providing visuals.

  1. Thumbnail Link Syntax:

    • You can display a thumbnail that links to a full-size image with the following format:
    [![Thumbnail Description](https://example.com/thumbnail.jpg)](https://example.com/full-image.jpg)
    
    • Explanation:
      • Thumbnail Description: This is a descriptive text that appears if the image doesn't load.
      • thumbnail-url: The URL of the thumbnail image.
      • full-image-url: The URL the image links to when clicked.

Example

Here's a complete example:

[![Cute Cat](https://example.com/cute-cat-thumbnail.jpg)](https://example.com/cute-cat-full.jpg)

This creates a clickable thumbnail of a cute cat that leads to the full-sized image when clicked.