Fit #

Controls how the image is fitted to its target dimensions. Below are a couple of examples. Some of these values are based on the object-fit CSS property.

Inside &fit=inside #

Default. Preserving aspect ratio, resize the image to be as large as possible while ensuring its dimensions are less than or equal to both those specified.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=inside">

![Inside](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=inside)

Outside &fit=outside #

Preserving aspect ratio, resize the image to be as small as possible while ensuring its dimensions are greater than or equal to both those specified.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=outside">

![Outside](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=outside)

Cover &fit=cover #

Crop the image to cover both provided dimensions.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=cover">

![Cover](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=cover)

Fill &fit=fill #

Ignore the aspect ratio of the input and stretch to both provided dimensions.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=fill">

![Fill](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=fill)

Contain &fit=contain #

Embed within both provided dimensions. The remaining space can be filled with a background color by using &cbg=. See here for the supported color formats.

More info: Issue #80 - letterbox images that need to fit.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=contain&cbg=black">

![Contain](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=contain&cbg=black)

Without enlargement &we #

Do not enlarge if the width or height are already less than the specified dimensions.

<img src="//wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=inside&we">

![Without enlargement](https://wsrv.nl/?url=wsrv.nl/lichtenstein.jpg&w=300&h=300&fit=inside&we)