---
url: https://docs.youcan.shop/themes/filters/html/imageUrl.md
---
# Image Url

You get the URL of an image, resized to the size you give.

```liquid
{{ image | image_url: width: number, height: number, crop: string }}
```

You can pass an image URL, an image object from an `image_picker` setting, or a product or collection preview image.

## Options

| Option | Type | Description |
| ------ | ---- | ----------- |
| `width` | `number` | The width of the image in pixels. Max `5760`. |
| `height` | `number` | The height of the image in pixels. Max `5760`. |
| `crop` | `string` | The part of the image that is kept when both `width` and `height` are set. One of `center`, `top`, `bottom`, `left`, `right`. |

Without `crop`, the image is resized to fit inside `width` and `height`, and the aspect ratio is kept. An image is never made larger than its original size. Other options are ignored.

When you give no option, you get the URL of the original image.

## Example

```liquid
{{ section.settings.image | image_url: width: 600 }}
{{ section.settings.image | image_url: width: 400, height: 400, crop: 'center' }}
```

::: tip Output

```html
https://cdn.youcan.shop/stores/acme/hat.png?width=600
https://cdn.youcan.shop/stores/acme/hat.png?width=400&height=400&crop=center
```

:::