# Width and height

Resizes an image to a specified width or height while preserving its original aspect ratio. You need to specify the **`width`** or **`height`** parameter in pixels. After transformation, the image will be compressed and delivered via CDN.

<mark style="color:orange;">**width**</mark> | <mark style="color:orange;">**w**</mark>

<mark style="color:orange;">**height**</mark> | <mark style="color:orange;">**h**</mark>

## Examples

| Preview                                                                                                                               | Syntax                                                                                                                                                                                                            |
| ------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ![](https://content.gitbook.com/content/IDIcmPiz7q6Sr6ZHHQxV/blobs/gvMipdqSQn2uR8TqqZba/image.png)                                    | [/samples.scaleflex.com/birds.jpg?<mark style="color:orange;">**w=600**</mark>](https://doc.cloudimg.io/https://samples.scaleflex.com/birds.jpg?w=600)                                                            |
| ![](https://content.gitbook.com/content/IDIcmPiz7q6Sr6ZHHQxV/blobs/7C4M5EuBKN9hNAr5HS9u/image.png)                                    | [/samples.scaleflex.com/frog.png?<mark style="color:orange;">**width=415**</mark>](https://doc.cloudimg.io/https://samples.scaleflex.com/frog.png?width=415)                                                      |
| ![](https://content.gitbook.com/content/IDIcmPiz7q6Sr6ZHHQxV/blobs/QUR8zN3NU8X7AQiHmtJS/image.png)                                    | [/samples.scaleflex.com/paris-salon2.jpg?<mark style="color:orange;">**h=430**</mark>](https://doc.cloudimg.io/https://samples.scaleflex.com/paris-salon2.jpg?h=430)                                              |
| <img src="https://content.gitbook.com/content/IDIcmPiz7q6Sr6ZHHQxV/blobs/3FiQlp4HEd6HDPYK52Ki/image.png" alt="" data-size="original"> | [<mark style="color:blue;">**/samples.scaleflex.com/mountains.jpg?**</mark><mark style="color:orange;">**h=400\&w=350**</mark>](https://doc.cloudimg.io/https://samples.scaleflex.com/mountains.jpg?h=400\&w=350) |
| <img src="https://content.gitbook.com/content/IDIcmPiz7q6Sr6ZHHQxV/blobs/hIEi1g7Ru0CQfpZCaJYo/image.png" alt="" data-size="original"> | [<mark style="color:blue;">**/samples.scaleflex.com/tesla.jpg?**</mark><mark style="color:orange;">**height=350**</mark>](https://doc.cloudimg.io/https://samples.scaleflex.com/tesla.jpg?height=350)             |