# Image Optimizations

Filebase includes an image resizing and optimization feature that can be accessed through any Filebase dedicated gateway. These features allow you to dynamically resize and optimize images served through your IPFS gateway, improving performance and load times for your web applications.

Any image that can be loaded using a dedicated gateway can be manipulated through query string parameters. ‌This includes both images that you have pinned to your account and images loaded from the public IPFS network.

### Using Image Optimization

To utilize image optimization, at least one option must be specified. These parameters can be added to the URL of the image file. For example:

```
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-width=300
```

To specify multiple options, simply add additional query string parameters in standard format:

```
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-height=200&img-sharpen=10
```

### **Options**

* **img-width=x**
  * Specifies the maximum width of the image in pixels.
* **img-height=x**
  * Specifies the maximum height of the image in pixels.
* **img-dpr=x**
  * Refers to the device pixel ratio. The default value is 1.
* **img-fit**
  * Refers to the image’s width and height. Any resizing modes will retain the image’s aspect ratio. Additional modifiers include:
    * **img-fit=scale-down:** The image will be decreased in size that matches the provided width or height.
    * **img-fit=contain:** The image will be resized to be as large as possible within the provided parameters.
    * **img-fit=cover:** The image will be resized to match the amount specified through the width and height parameters.
    * **img-fit=crop:** The image will be downsized and cropped to fit within the size specified by the width and height parameters.
    * **img-fit=pad:** The image will be resized to be as large as possible within the given width or height parameters.
* **img-gravity**
  * **img-gravity=auto**
  * **img-gravity=side** and **img-gravity=XxY**
* **img-quality=x**
  * This parameter specifies the quality of images in the JPEG and WebP formats.
* **img-format=auto**
  * This parameter refers to the standard image format JPEG/PNG, which will be used if this option is not specified.
* i**mg-anim=false**
  * This parameter reduces frames for animated images such as GIFs.
* **img-sharpen=x**
  * This parameter specifies the strength of the sharpening filter. The value is a floating-point number between 0, which refers to no sharpening, and 10, which refers to maximum sharpening. For most images, 1 is the recommended value.
* **img-onerror=redirect**
* **img-metadata**
  * Controls if the metadata should be preserved for the specified image.
    * **img-metadata=keep**
    * **img-metadata=copyright**

### Examples

#### Dynamic Resizing

You can resize images dynamically by appending query parameters to the image URL. The following parameters are available:

* `img-width`: Specifies the width of the image in pixels.
* `img-height:` Specifies the height of the image in pixels.

#### Example: Resizing an Image

To resize an image to 200x200 pixels, use the following URL format:

```url
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-width=200&img-height=200
```

#### Format Conversion

You can convert images to different formats by specifying the `img-format` parameter. Supported formats include `jpeg`, `png`, and `webp`.

#### Example: Converting an Image Format

To convert an image to WebP format, use the following URL format:

```url
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-format=webp
```

#### Compression

Image compression is automatically applied to optimize the file size. You can control the quality of compression using the `img-quality` parameter, which accepts values from 0 to 100 (where 100 is the highest quality).

#### Example: Compressing an Image

To compress an image with 80% quality, use the following URL format:

```url
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-quality=80
```

#### Combining Parameters

You can combine multiple parameters to apply resizing, format conversion, and compression in a single request.

#### Example: Resizing, Converting, and Compressing an Image

To resize an image to 300x300 pixels, convert it to JPEG format, and apply 90% quality compression, use the following URL format:

```url
https://documentation.myfilebase.com/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR?img-width=300&img-height=300&img-format=jpeg&img-quality=90
```

### Best Practices

* **Use Appropriate Dimensions**: Resize images to the dimensions required for display to avoid serving unnecessarily large files.
* **Choose Optimal Formats**: Use modern formats like WebP for better compression and quality.
* **Balance Quality and Size**: Adjust the quality parameter to find a balance between image quality and file size.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.filebase.com/dedicated-ipfs-gateways/image-optimizations.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.