Resizing Images

March 24, 2023 1 min read Docs Markdown Resize

Learn how to resize images.

Donate

Become a backer or sponsor to support our work.

On this page

Syntax

To resize images, you’ll need to specify width and height query parameters.

The original size of public and external images will not be changed.

Source

1![Resize](/images/great-wall.jpg?width=300)

Result

Source

1![Resize](/images/great-wall.jpg?height=180)

Result

Source

1![Resize](/images/great-wall.jpg?width=300&height=180)

Result

Source

1![Resize](/images/great-wall.jpg?width=300&quality=100)

Result

Source

1![Resize](images/example.jpg?width=100&height=100)

Result

It’s recommend telling module the intrinsic size of external images by naturalWidth and naturalHeight query parameters.

Source

1![Resize](https://avatars.githubusercontent.com/u/128204519?s=200&v=4&naturalWidth=200&naturalHeight=200&width=100&height=100)

Result