> For the complete documentation index, see [llms.txt](https://docs.scaleflex.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.scaleflex.com/dynamic-media-optimization-dmo/transformations/image-optimization/operations/crop.md).

# Crop

Resize and crop to achieve the desired width and height

Crops the image to specified dimensions (**width** and **height**) while keeping proportions and delivers the resulting image via CDN.

<mark style="color:orange;">**func=crop**</mark>

{% hint style="info" %}
This is the default resizing mode when both **width** and **height** operations are used. You do not need to specify **func=crop** explicitly.
{% endhint %}

## Examples

| Preview                                                                                                                                                                                                             | Syntax                                                                                                                                                                                                                           |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ![](https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FK0Q0u00y2xHIAoxaGw5A%2Fimage.png?alt=media\&token=d566301a-6f48-4aab-80fa-fcc882fe05c1) | [/docs/birds.jpg?<mark style="color:orange;">**func=crop**</mark>&<mark style="color:orange;">**w=600**</mark>&<mark style="color:orange;">**h=310**</mark>](https://fdocs.filerobot.com/docs/birds.jpg?func=crop\&w=600\&h=310) |
| ![](https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FpnsVITNMnJ9JdXQLA7WR%2Fimage.png?alt=media\&token=46e51441-b0e6-4e6d-97fd-b4e1afa7c465) | [/docs/birds.jpg?<mark style="color:orange;">**w=600**</mark>&<mark style="color:orange;">**h=410**</mark>](https://fdocs.filerobot.com/docs/birds.jpg?w=600\&h=410)                                                             |

## Gravity

Specifies which part of the image you wish to keep while cropping. If you omit the gravity option, central cropping is performed.

<mark style="color:orange;">**gravity=X**</mark>

### Available gravity values

| <mark style="color:orange;">**northwest**</mark>                                                                                                                                                 | <mark style="color:orange;">**north**</mark>                                                                                                               | <mark style="color:orange;">**northeast**</mark>                                                                                                                                       |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <mark style="color:orange;">**west**</mark>                                                                                                                                                      | <mark style="color:orange;">**center**</mark> \| <mark style="color:orange;">**centre**</mark> (default)                                                   | <mark style="color:orange;">**east**</mark>                                                                                                                                            |
| <mark style="color:orange;">**southwest**</mark>                                                                                                                                                 | <mark style="color:orange;">**south**</mark>                                                                                                               | <mark style="color:orange;">**southeast**</mark>                                                                                                                                       |
| <mark style="color:orange;">**auto**</mark> - [more info](/dynamic-media-optimization-dmo/transformations/image-optimization/operations/crop/automatic-gravity-crop.md#automatic-gravity-legacy) | <mark style="color:orange;">**face**</mark> - [more info](/dynamic-media-optimization-dmo/transformations/image-optimization/operations/crop/face-crop.md) | <mark style="color:orange;">**smart**</mark> - [more info](/dynamic-media-optimization-dmo/transformations/image-optimization/operations/crop/automatic-gravity-crop.md#smart-gravity) |
| <mark style="color:orange;">**X,Y**</mark> - [more info](/dynamic-media-optimization-dmo/transformations/image-optimization/operations/crop/focal-point-crop.md)                                 |                                                                                                                                                            |                                                                                                                                                                                        |

### Examples

| Preview                                                                                                                                                                                                             | Syntax                                                                                                                                                                                                                                               |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ![](https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2F03jqyuGanUjrsqbUkdcp%2Fimage.png?alt=media\&token=eb2c80ba-5442-4934-87e0-9510806ae4ab) | [/docs/paris-salon2.jpg?<mark style="color:orange;">**w=500**</mark>&<mark style="color:orange;">**h=430**</mark>&<mark style="color:orange;">**gravity=west**</mark>](https://fdocs.filerobot.com/docs/paris-salon2.jpg?w=500\&h=430\&gravity=west) |
| ![](https://2536208400-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqsq2dR7Fjagf5eTifWZx%2Fuploads%2FByUBquLGZMH0QDVC311e%2Fimage.png?alt=media\&token=1e5328ec-92b2-4c2a-a8e6-1d9c5747cf30) | [/docs/paris-salon2.jpg?<mark style="color:orange;">**w=500**</mark>&<mark style="color:orange;">**h=430**</mark>&<mark style="color:orange;">**gravity=east**</mark>](https://fdocs.filerobot.com/docs/paris-salon2.jpg?w=500\&h=430\&gravity=east) |
|                                                                                                                                                                                                                     |                                                                                                                                                                                                                                                      |