> For the complete documentation index, see [llms.txt](https://docs.imagemash.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.imagemash.io/image-transform/transform-options/crop.md).

# Crop

crop - c - c\_\<crop type>

<table><thead><tr><th width="136.33333333333331">Value</th><th width="92">Type</th><th>Description</th></tr></thead><tbody><tr><td><strong>crop type</strong></td><td>string</td><td><p><em>Default Value: <strong>cover</strong></em></p><p>Value can be;</p><ul><li>cover</li><li>contain</li><li>fill</li><li>crop (<a href="/image-transform/transform-options/helpers/x-y.md">x,y</a> or <a href="/image-transform/transform-options/gravity.md#face-faces-object-detection">AI Object Position needed</a>)</li><li>thumb (<a href="/image-transform/transform-options/gravity.md#face-faces-object-detection">AI Object Position needed</a>)</li></ul><p>Eg. c_contain, c_crop, ...<br><br><em>Required Parameters:</em><br><a href="/image-transform/transform-options/width.md">width</a>, <a href="/image-transform/transform-options/height.md">height</a><br></p></td></tr></tbody></table>

Sets the crop type of image. When both [width](/image-transform/transform-options/width.md) and [height](/image-transform/transform-options/height.md) are provided, the original image aspect ratio might get broken. By changing crop type, you can adjust the aspect ratio.

### Understand Main Crop Types

<figure><img src="https://demo.imagemash.io/w_1000/crop_type_explanation.png" alt=""><figcaption><p>Crop Types Visualised</p></figcaption></figure>

### Original Image

<figure><img src="https://demo.imagemash.io/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/woman3.jpg">https://demo.imagemash.io/woman3.jpg</a></p></figcaption></figure>

### Cover (default) - c\_cover

Preserves the aspect ratio. Tries to cover the requested dimensions without disturbing images. Some parts of the image may get clipped off.

{% tabs %}
{% tab title="Gravity Center" %}
You can use [Gravity](/image-transform/transform-options/gravity.md) to adjust image gravity. By default, it is [center](/image-transform/transform-options/gravity.md#locational). (g\_center)

<figure><img src="https://demo.imagemash.io/w_400,h_150/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150/woman3.jpg">https://demo.imagemash.io/w_400,h_150/woman3.jpg</a></p></figcaption></figure>
{% endtab %}

{% tab title="Face/Object Gravity" %}
With [Gravity](/image-transform/transform-options/gravity.md) parameter set to [Face](/image-transform/transform-options/gravity.md#face-faces-object-detection) (g\_face)

<figure><img src="https://demo.imagemash.io/w_400,h_150,g_face/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,g_face/woman3.jpg">https://demo.imagemash.io/w_400,h_150,g_face/woman3.jpg</a></p></figcaption></figure>

With [Gravity](/image-transform/transform-options/gravity.md) parameter set to Laptop (g\_laptop)

<figure><img src="https://demo.imagemash.io/w_400,h_150,g_laptop/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,g_laptop/woman3.jpg">https://demo.imagemash.io/w_400,h_150,g_laptop/woman3.jpg</a></p></figcaption></figure>
{% endtab %}

{% tab title="Gravity location" %}
With [Gravity](/image-transform/transform-options/gravity.md) parameter set to [Top](/image-transform/transform-options/gravity.md#locational) (g\_t)

<figure><img src="https://demo.imagemash.io/w_400,h_150,g_t/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,g_t/woman3.jpg">https://demo.imagemash.io/w_400,h_150,g_t/woman3.jpg</a></p></figcaption></figure>

With [Gravity](/image-transform/transform-options/gravity.md) parameter set to [Bottom](/image-transform/transform-options/gravity.md#locational) (g\_b)

<figure><img src="https://demo.imagemash.io/w_400,h_150,g_b/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,g_b/woman3.jpg">https://demo.imagemash.io/w_400,h_150,g_b/woman3.jpg</a></p></figcaption></figure>
{% endtab %}
{% endtabs %}

### Contain - c\_contain&#x20;

Preserves the aspect ratio. Fits the whole image in the requested dimensions. If there are empty spaces, they are filled with [background color](/image-transform/transform-options/background.md) (bg).

<figure><img src="https://demo.imagemash.io/w_400,h_150,c_contain/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,c_contain/woman3.jpg">https://demo.imagemash.io/w_400,h_150,c_contain/woman3.jpg</a></p></figcaption></figure>

### Fill - c\_fill

Ignores the aspect ratio. Stretches the image to fill empty spaces.

<figure><img src="https://demo.imagemash.io/w_400,h_150,c_fill/woman3.jpg" alt=""><figcaption><p><a href="https://demo.imagemash.io/w_400,h_150,c_fill/woman3.jpg">https://demo.imagemash.io/w_400,h_150,c_fill/woman3.jpg</a></p></figcaption></figure>

### Crop - c\_crop

Crops a region from image.

Should either use with [x,y](/image-transform/transform-options/helpers/x-y.md) coordinates or [AI Object Gravity](/image-transform/transform-options/gravity.md#face-faces-object-detection).

{% tabs %}
{% tab title="Crop with coordinates" %}
Crop needs a region in order to work.

To satisfy this condition, we provide [width](/image-transform/transform-options/width.md), [height](/image-transform/transform-options/height.md), [x, y](/image-transform/transform-options/helpers/x-y.md).

`https://demo.imagemash.io/w_200,h_200,x_100,y_300,c_crop/woman3.jpg`

<figure><img src="https://demo.imagemash.io/w_200,h_200,x_100,y_300,c_crop/woman3.jpg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Crop + AI Object Gravity" %}
Cropping with dimensions and [AI Object Gravity](/image-transform/transform-options/gravity.md#face-faces-object-detection)

`https://demo.imagemash.io/w_100,h_100,g_face,c_crop/woman3.jpg`

<figure><img src="https://demo.imagemash.io/w_100,h_100,g_face,c_crop/woman3.jpg" alt=""><figcaption></figcaption></figure>

You can also use c\_crop with [AI Object Gravity](/image-transform/transform-options/gravity.md#face-faces-object-detection) without width and height. It returns the detected region as a result.

`https://demo.imagemash.io/g_laptop,c_crop/woman3.jpg`

<figure><img src="https://demo.imagemash.io/g_laptop,c_crop/woman3.jpg" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Thumb - c\_thumb

Thumb is specifically designed to make thumbnails from images. It has special algorithms that differentiate it from [Crop](/image-transform/transform-options/crop.md#crop). Use c\_thumb instead of c\_crop if you are making thumbnails.

Needs [AI Object gravity](/image-transform/transform-options/gravity.md#face-faces-object-detection) in order to work.

{% tabs %}
{% tab title="Example 1" %}
`https://demo.imagemash.io/w_200,h_200,g_face,c_thumb/woman3.jpg`

<figure><img src="https://demo.imagemash.io/c_thumb,g_face,w_200,h_200/woman3.jpg" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}
Making a rounded thumbnail from an image.

`https://demo.imagemash.io/w_200,h_200,g_face,c_thumb,r_100,bo_10_skyblue/woman3.jpg`

<figure><img src="https://demo.imagemash.io/w_200,h_200,g_face,c_thumb,r_100,bo_10_skyblue/woman3.jpg" alt=""><figcaption></figcaption></figure>

Making a banner from an image.

`https://demo.imagemash.io/w_800,h_200,g_face,c_thumb,r_15,bo_5_skyblue/woman3.jpg`

<figure><img src="https://demo.imagemash.io/w_800,h_200,g_face,c_thumb,r_15,bo_5_skyblue/woman3.jpg" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Hey! Take a look at [Named Transforms](/image-transform/named-transforms.md), you can assign your transforms into custom variables.
{% endhint %}
{% endtab %}
{% endtabs %}
