> ## Documentation Index
> Fetch the complete documentation index at: https://cloudinary.com/documentation/llms.txt
> Use this file to discover all available pages before exploring further.

# Video resize modes


The resize modes adjust the dimensions of a video without cropping out any elements from the original. This page covers `scale`, `fit`, `limit`, `pad`, and `lpad` — modes that fit the video within a bounding box or add padding as needed. For crop modes (`fill`, `fill_pad`, `crop`), see [Video crop modes](video_crop_modes).

## scale

The `scale` resize mode changes the size of the video exactly to the specified dimensions without necessarily retaining the original aspect ratio: all original video parts are visible but might be stretched or squashed. If only the width or height is specified, then the video is scaled to the new dimension while retaining the original aspect ratio.

**See full syntax**: [c_scale](transformation_reference#c_scale) in the _Transformation Reference_.
  
### Example 1: Scale while maintaining aspect ratio 

Scale the {variable:mediaName2} video to a width of 150 pixels (maintains the aspect ratio by default):

![Image scaled to a width of 150 pixels](https://res.cloudinary.com/demo/image/upload/c_scale,w_150/docs/camera.jpg "width:150")

```nodejs
cloudinary.image("docs/camera.jpg", {width: 150, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150));
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150));
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150));
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150));
```

```python
CloudinaryImage("docs/camera.jpg").image(width=150, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::scale()->width(150));
```

```java
cloudinary.url().transformation(new Transformation().width(150).crop("scale")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", width: 150, crop: "scale")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(150).Crop("scale")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(150)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(150).setCrop("scale")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().width(150).crop("scale")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(150)));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.scale() { width(150) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {width: 150, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150));
```

![Video scaled to a width of 150 pixels](https://res.cloudinary.com/demo/video/upload/c_scale,w_150/guy_woman_mobile.mp4 "width:150")

```nodejs
cloudinary.video("guy_woman_mobile", {width: 150, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(150));
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(150));
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(150));
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(150));
```

```python
CloudinaryVideo("guy_woman_mobile").video(width=150, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::scale()->width(150));
```

```java
cloudinary.url().transformation(new Transformation().width(150).crop("scale")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", width: 150, crop: "scale")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(150).Crop("scale")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(150)));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setWidth(150).setCrop("scale")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().width(150).crop("scale")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(150)));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.scale() { width(150) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {width: 150, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(150));
```

### Example 2: Scale without maintaining aspect ratio

Scale the {variable:mediaName2} video to a width and height of 150 pixels without maintaining the aspect ratio:

![Image scaled to a width and height of 150 pixels](https://res.cloudinary.com/demo/image/upload/c_scale,h_150,w_150/docs/camera.jpg "width:150")

```nodejs
cloudinary.image("docs/camera.jpg", {height: 150, width: 150, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150).height(150));
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150).height(150));
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150).height(150));
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150).height(150));
```

```python
CloudinaryImage("docs/camera.jpg").image(height=150, width=150, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::scale()->width(150)
->height(150));
```

```java
cloudinary.url().transformation(new Transformation().height(150).width(150).crop("scale")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", height: 150, width: 150, crop: "scale")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Height(150).Width(150).Crop("scale")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(150)
.height(150)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setHeight(150).setWidth(150).setCrop("scale")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().height(150).width(150).crop("scale")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(150)
.height(150)));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.scale() { width(150)
 height(150) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {height: 150, width: 150, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(150).height(150));
```

![Video scaled to a width and height of 150 pixels](https://res.cloudinary.com/demo/video/upload/c_scale,h_150,w_150/guy_woman_mobile.mp4 "width:150")

```nodejs
cloudinary.video("guy_woman_mobile", {height: 150, width: 150, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(150).height(150)
);
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(150).height(150)
);
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(150).height(150)
);
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(150).height(150)
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(height=150, width=150, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::scale()->width(150)
->height(150));
```

```java
cloudinary.url().transformation(new Transformation().height(150).width(150).crop("scale")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", height: 150, width: 150, crop: "scale")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Height(150).Width(150).Crop("scale")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(150)
.height(150)));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setHeight(150).setWidth(150).setCrop("scale")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().height(150).width(150).crop("scale")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(150)
.height(150)));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.scale() { width(150)
 height(150) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {height: 150, width: 150, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(150).height(150)
);
```

### Example 3: Scale by a percentage

Scale the {variable:mediaName2} video to a width of 25% (maintains the aspect ratio by default):

![Image scaled to a width of 25%](https://res.cloudinary.com/demo/image/upload/c_scale,w_0.25/docs/camera.jpg "width:320")

```nodejs
cloudinary.image("docs/camera.jpg", {width: "0.25", crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(0.25));
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(0.25));
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(0.25));
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(0.25));
```

```python
CloudinaryImage("docs/camera.jpg").image(width="0.25", crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::scale()->width(0.25));
```

```java
cloudinary.url().transformation(new Transformation().width(0.25).crop("scale")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", width: 0.25, crop: "scale")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(0.25).Crop("scale")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(0.25)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(0.25).setCrop("scale")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().width(0.25).crop("scale")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(0.25)));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.scale() { width(0.25F) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {width: "0.25", crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(scale().width(0.25));
```

![Video scaled to a width of 25%](https://res.cloudinary.com/demo/video/upload/c_scale,w_0.25/guy_woman_mobile.mp4 "width:480")

```nodejs
cloudinary.video("guy_woman_mobile", {width: "0.25", crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(0.25));
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(0.25));
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(0.25));
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(0.25));
```

```python
CloudinaryVideo("guy_woman_mobile").video(width="0.25", crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::scale()->width(0.25));
```

```java
cloudinary.url().transformation(new Transformation().width(0.25).crop("scale")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", width: 0.25, crop: "scale")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(0.25).Crop("scale")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(0.25)));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setWidth(0.25).setCrop("scale")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().width(0.25).crop("scale")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(0.25)));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.scale() { width(0.25F) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {width: "0.25", crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(scale().width(0.25));
```

### Example 4: Scale by setting the aspect ratio and width

Scale the {variable:mediaName2} video to a width of 100, changing the aspect ratio to 1:2:

![Image scaled using aspect ratio](https://res.cloudinary.com/demo/image/upload/ar_1:2,c_scale,w_100/docs/camera.jpg "width:100")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "1:2", width: 100, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="1:2", width=100, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::scale()->width(100)
->aspectRatio("1:2"));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1:2").width(100).crop("scale")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "1:2", width: 100, crop: "scale")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("1:2").Width(100).Crop("scale")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(100)
.aspectRatio("1:2")));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("1:2").setWidth(100).setCrop("scale")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1:2").width(100).crop("scale")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.scale().width(100)
.aspectRatio("1:2")));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.scale() { width(100)
 aspectRatio("1:2") }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "1:2", width: 100, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  scale().width(100).aspectRatio("1:2")
);
```

![Video scaled using aspect ratio](https://res.cloudinary.com/demo/video/upload/ar_1:2,c_scale,w_100/guy_woman_mobile.mp4 "width:100")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "1:2", width: 100, crop: "scale"})
```

```react
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```vue
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```angular
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```js
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(100).aspectRatio("1:2")
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="1:2", width=100, crop="scale")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::scale()->width(100)
->aspectRatio("1:2"));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1:2").width(100).crop("scale")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "1:2", width: 100, crop: "scale")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("1:2").Width(100).Crop("scale")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(100)
.aspectRatio("1:2")));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("1:2").setWidth(100).setCrop("scale")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1:2").width(100).crop("scale")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.scale().width(100)
.aspectRatio("1:2")));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.scale() { width(100)
 aspectRatio("1:2") }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "1:2", width: 100, crop: "scale"})
```

```react_native
import { scale } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  scale().width(100).aspectRatio("1:2")
);
```

## fit

The `fit` resize mode resizes the video so that it takes up as much space as possible within a bounding box defined by the specified dimensions. The original aspect ratio is retained and all of the original video is visible. 

**See full syntax**: [c_fit](transformation_reference#c_fit) in the _Transformation Reference_.

### Example 1: Fit the video inside a square bounding box

Resize the {variable:mediaName2} video to fit within a width and height of 250 pixels while retaining the aspect ratio:

![Image fit to a width and height of 250 pixels](https://res.cloudinary.com/demo/image/upload/c_fit,h_250,w_250/docs/camera.jpg "width: 250")

```nodejs
cloudinary.image("docs/camera.jpg", {height: 250, width: 250, crop: "fit"})
```

```react
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(fit().width(250).height(250));
```

```vue
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(fit().width(250).height(250));
```

```angular
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(fit().width(250).height(250));
```

```js
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(fit().width(250).height(250));
```

```python
CloudinaryImage("docs/camera.jpg").image(height=250, width=250, crop="fit")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::fit()->width(250)
->height(250));
```

```java
cloudinary.url().transformation(new Transformation().height(250).width(250).crop("fit")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", height: 250, width: 250, crop: "fit")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Height(250).Width(250).Crop("fit")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.fit().width(250)
.height(250)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setHeight(250).setWidth(250).setCrop("fit")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().height(250).width(250).crop("fit")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.fit().width(250)
.height(250)));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.fit() { width(250)
 height(250) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {height: 250, width: 250, crop: "fit"})
```

```react_native
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(fit().width(250).height(250));
```

![Video fit to a width and height of 250 pixels](https://res.cloudinary.com/demo/video/upload/c_fit,h_250,w_250/guy_woman_mobile.mp4 "width: 250")

```nodejs
cloudinary.video("guy_woman_mobile", {height: 250, width: 250, crop: "fit"})
```

```react
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().width(250).height(250)
);
```

```vue
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().width(250).height(250)
);
```

```angular
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().width(250).height(250)
);
```

```js
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().width(250).height(250)
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(height=250, width=250, crop="fit")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::fit()->width(250)
->height(250));
```

```java
cloudinary.url().transformation(new Transformation().height(250).width(250).crop("fit")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", height: 250, width: 250, crop: "fit")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Height(250).Width(250).Crop("fit")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.fit().width(250)
.height(250)));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setHeight(250).setWidth(250).setCrop("fit")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().height(250).width(250).crop("fit")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.fit().width(250)
.height(250)));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.fit() { width(250)
 height(250) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {height: 250, width: 250, crop: "fit"})
```

```react_native
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().width(250).height(250)
);
```

### Example 2: Use aspect ratio to define a bounding box

Resize the {variable:mediaName2} video to fit within a 150-pixel square defined by aspect ratio and height:

![Image fit to a 150-pixel square](https://res.cloudinary.com/demo/image/upload/ar_1.0,c_fit,h_150/docs/camera.jpg "width: 150")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", height: 150, crop: "fit"})
```

```react
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```vue
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```angular
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```js
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="1.0", height=150, crop="fit")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::fit()->height(150)
->aspectRatio(1.0));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("fit")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "1.0", height: 150, crop: "fit")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("1.0").Height(150).Crop("fit")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.fit().height(150)
.aspectRatio('1.0')));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("1.0").setHeight(150).setCrop("fit")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("fit")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.fit().height(150)
.aspectRatio('1.0')));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.fit() { height(150)
 aspectRatio(1.0F) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", height: 150, crop: "fit"})
```

```react_native
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  fit().height(150).aspectRatio("1.0")
);
```

![Video fit to a 150-pixel square](https://res.cloudinary.com/demo/video/upload/ar_1.0,c_fit,h_150/guy_woman_mobile.mp4 "width: 150")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", height: 150, crop: "fit"})
```

```react
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```vue
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```angular
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```js
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().height(150).aspectRatio("1.0")
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="1.0", height=150, crop="fit")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::fit()->height(150)
->aspectRatio(1.0));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("fit")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "1.0", height: 150, crop: "fit")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("1.0").Height(150).Crop("fit")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.fit().height(150)
.aspectRatio('1.0')));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("1.0").setHeight(150).setCrop("fit")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("fit")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.fit().height(150)
.aspectRatio('1.0')));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.fit() { height(150)
 aspectRatio(1.0F) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", height: 150, crop: "fit"})
```

```react_native
import { fit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  fit().height(150).aspectRatio("1.0")
);
```## limit

The `limit` resize mode behaves the same as the `fit` mode but only if the original video is larger than the specified limit (width and height), in which case the video is scaled down so that it takes up as much space as possible within a bounding box defined by the specified dimensions. The original aspect ratio is retained and all of the original video is visible. This mode doesn't scale up the video if your requested dimensions are larger than the original video's.

**See full syntax**: [c_limit](transformation_reference#c_limit) in the _Transformation Reference_.

  
### Example 1: Limit the size of the video to a square bounding box

Limit the {variable:mediaName2} video to a width and height of 250 pixels while retaining the aspect ratio:

![video limited to a width and height of 250 pixels](https://res.cloudinary.com/demo/image/upload/c_limit,h_250,w_250/docs/camera.jpg "width:250")

```nodejs
cloudinary.image("docs/camera.jpg", {height: 250, width: 250, crop: "limit"})
```

```react
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().width(250).height(250)
);
```

```vue
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().width(250).height(250)
);
```

```angular
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().width(250).height(250)
);
```

```js
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().width(250).height(250)
);
```

```python
CloudinaryImage("docs/camera.jpg").image(height=250, width=250, crop="limit")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::limitFit()->width(250)
->height(250));
```

```java
cloudinary.url().transformation(new Transformation().height(250).width(250).crop("limit")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", height: 250, width: 250, crop: "limit")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Height(250).Width(250).Crop("limit")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitFit().width(250)
.height(250)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setHeight(250).setWidth(250).setCrop("limit")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().height(250).width(250).crop("limit")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitFit().width(250)
.height(250)));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.limitFit() { width(250)
 height(250) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {height: 250, width: 250, crop: "limit"})
```

```react_native
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().width(250).height(250)
);
```

![video limited to a width and height of 250 pixels](https://res.cloudinary.com/demo/video/upload/c_limit,h_250,w_250/guy_woman_mobile.mp4 "width:250")

```nodejs
cloudinary.video("guy_woman_mobile", {height: 250, width: 250, crop: "limit"})
```

```react
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().width(250).height(250)
);
```

```vue
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().width(250).height(250)
);
```

```angular
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().width(250).height(250)
);
```

```js
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().width(250).height(250)
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(height=250, width=250, crop="limit")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::limitFit()->width(250)
->height(250));
```

```java
cloudinary.url().transformation(new Transformation().height(250).width(250).crop("limit")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", height: 250, width: 250, crop: "limit")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Height(250).Width(250).Crop("limit")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitFit().width(250)
.height(250)));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setHeight(250).setWidth(250).setCrop("limit")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().height(250).width(250).crop("limit")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitFit().width(250)
.height(250)));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.limitFit() { width(250)
 height(250) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {height: 250, width: 250, crop: "limit"})
```

```react_native
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().width(250).height(250)
);
```

### Example 2: Use aspect ratio to define a limiting bounding box

Limit the {variable:mediaName2} video to a 150-pixel square defined by aspect ratio and height:

![video limited to a 150-pixel square](https://res.cloudinary.com/demo/image/upload/ar_1.0,c_limit,h_150/docs/camera.jpg "width:150")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", height: 150, crop: "limit"})
```

```react
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```vue
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```angular
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```js
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="1.0", height=150, crop="limit")
```

```php
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::limitFit()->height(150)
->aspectRatio(1.0));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("limit")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "1.0", height: 150, crop: "limit")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("1.0").Height(150).Crop("limit")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitFit().height(150)
.aspectRatio('1.0')));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("1.0").setHeight(150).setCrop("limit")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("limit")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitFit().height(150)
.aspectRatio('1.0')));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.limitFit() { height(150)
 aspectRatio(1.0F) }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", height: 150, crop: "limit"})
```

```react_native
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/camera.jpg").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

![video limited to a 150-pixel square](https://res.cloudinary.com/demo/video/upload/ar_1.0,c_limit,h_150/guy_woman_mobile.mp4 "width:150")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", height: 150, crop: "limit"})
```

```react
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```vue
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```angular
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```js
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="1.0", height=150, crop="limit")
```

```php
use Cloudinary\Transformation\Resize;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::limitFit()->height(150)
->aspectRatio(1.0));
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("limit")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "1.0", height: 150, crop: "limit")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("1.0").Height(150).Crop("limit")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitFit().height(150)
.aspectRatio('1.0')));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("1.0").setHeight(150).setCrop("limit")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").height(150).crop("limit")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitFit().height(150)
.aspectRatio('1.0')));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.limitFit() { height(150)
 aspectRatio(1.0F) }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", height: 150, crop: "limit"})
```

```react_native
import { limitFit } from "@cloudinary/url-gen/actions/resize";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitFit().height(150).aspectRatio("1.0")
);
```## pad

The `pad` resize mode resizes the video to fill the specified dimensions while retaining the original aspect ratio and with all of the original video visible. If the proportions of the original video do not match the specified dimensions, padding is added to the video to reach the required size. You can also specify where the original video is placed by using the [gravity][gravity-link] parameter (set to `center` by default), and specify the color of the [background](effects_and_artistic_enhancements#setting_background_color) in the case that padding is added.

If you're looking to apply padding to all sides of a video, consider using the [limit pad](#lpad_limit_pad) resize mode. 

**See full syntax**: [c_pad](transformation_reference#c_pad) in the _Transformation Reference_.

### Example 1: Resize and pad a video to fill the square defined by width and height

Resize and pad the {variable:mediaName2} video with a brown background to a width and height of 250 pixels:

![Image padded to a width and height of 250 pixels](https://res.cloudinary.com/demo/image/upload/b_brown,c_pad,h_250,w_250/docs/camera.jpg "width:250")

```nodejs
cloudinary.image("docs/camera.jpg", {background: "brown", height: 250, width: 250, crop: "pad"})
```

```react
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```vue
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```angular
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```js
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```python
CloudinaryImage("docs/camera.jpg").image(background="brown", height=250, width=250, crop="pad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::pad()->width(250)
->height(250)
	->background(
	Background::color(Color::BROWN))
	);
```

```java
cloudinary.url().transformation(new Transformation().background("brown").height(250).width(250).crop("pad")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", background: "brown", height: 250, width: 250, crop: "pad")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Background("brown").Height(250).Width(250).Crop("pad")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.pad().width(250)
.height(250)
	.background(
	Background.color(Color.BROWN))
	));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setBackground("brown").setHeight(250).setWidth(250).setCrop("pad")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().background("brown").height(250).width(250).crop("pad")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.pad().width(250)
.height(250)
	.background(
	Background.color(Color.BROWN))
	));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.pad() { width(250)
 height(250)
	 background(
	Background.color(Color.BROWN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {background: "brown", height: 250, width: 250, crop: "pad"})
```

```react_native
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

![Video padded to a width and height of 250 pixels](https://res.cloudinary.com/demo/video/upload/b_brown,c_pad,h_250,w_250/guy_woman_mobile.mp4 "width:250")

```nodejs
cloudinary.video("guy_woman_mobile", {background: "brown", height: 250, width: 250, crop: "pad"})
```

```react
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```vue
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```angular
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```js
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(background="brown", height=250, width=250, crop="pad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::pad()->width(250)
->height(250)
	->background(
	Background::color(Color::BROWN))
	);
```

```java
cloudinary.url().transformation(new Transformation().background("brown").height(250).width(250).crop("pad")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", background: "brown", height: 250, width: 250, crop: "pad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Background("brown").Height(250).Width(250).Crop("pad")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.pad().width(250)
.height(250)
	.background(
	Background.color(Color.BROWN))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setBackground("brown").setHeight(250).setWidth(250).setCrop("pad")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().background("brown").height(250).width(250).crop("pad")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.pad().width(250)
.height(250)
	.background(
	Background.color(Color.BROWN))
	));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.pad() { width(250)
 height(250)
	 background(
	Background.color(Color.BROWN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {background: "brown", height: 250, width: 250, crop: "pad"})
```

```react_native
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .width(250)
    .height(250)
    .background(color("brown"))
);
```

### Example 2: Resize and pad a video to fill the rectangle defined by aspect ratio

Resize and pad the {variable:mediaName2} video with a brown background to a rectangle of height of 150 pixels, and aspect ratio 2:1:

![Image padded to a height of 150 pixels and aspect ratio 2:1](https://res.cloudinary.com/demo/image/upload/ar_2:1,b_brown,c_pad,h_150/docs/camera.jpg "width:300")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad"})
```

```react
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```vue
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```angular
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```js
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="2:1", background="brown", height=150, crop="pad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::pad()->height(150)
->aspectRatio("2:1")
	->background(
	Background::color(Color::BROWN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("2:1").background("brown").height(150).crop("pad")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("2:1").Background("brown").Height(150).Crop("pad")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.pad().height(150)
.aspectRatio("2:1")
	.background(
	Background.color(Color.BROWN))
	));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("2:1").setBackground("brown").setHeight(150).setCrop("pad")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("2:1").background("brown").height(150).crop("pad")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.pad().height(150)
.aspectRatio("2:1")
	.background(
	Background.color(Color.BROWN))
	));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.pad() { height(150)
 aspectRatio("2:1")
	 background(
	Background.color(Color.BROWN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad"})
```

```react_native
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

![Video padded to a height of 150 pixels and aspect ratio 2:1](https://res.cloudinary.com/demo/video/upload/ar_2:1,b_brown,c_pad,h_150/guy_woman_mobile.mp4 "width:300")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad"})
```

```react
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```vue
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```angular
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```js
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="2:1", background="brown", height=150, crop="pad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::pad()->height(150)
->aspectRatio("2:1")
	->background(
	Background::color(Color::BROWN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("2:1").background("brown").height(150).crop("pad")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("2:1").Background("brown").Height(150).Crop("pad")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.pad().height(150)
.aspectRatio("2:1")
	.background(
	Background.color(Color.BROWN))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("2:1").setBackground("brown").setHeight(150).setCrop("pad")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("2:1").background("brown").height(150).crop("pad")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.pad().height(150)
.aspectRatio("2:1")
	.background(
	Background.color(Color.BROWN))
	));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.pad() { height(150)
 aspectRatio("2:1")
	 background(
	Background.color(Color.BROWN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "2:1", background: "brown", height: 150, crop: "pad"})
```

```react_native
import { pad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  pad()
    .height(150)
    .aspectRatio("2:1")
    .background(color("brown"))
);
```
### Example 3: Pad with blurred video background
You may sometimes need to deliver a video with an aspect ratio very different than the target video player dimensions, for example delivering a portrait video in a landscape-oriented video player. In these cases, you can use a blurred version of the same video as the padding background. To do this, specify the `blurred` value instead of a color as the `background`. You can also optionally specify the intensity of the blur effect (range: 1-2000, default 100) and the brightness of the background video (range: -300-100, default 0).

For example, deliver the Rubik's cube video in a 320\*480 HTML5 video player by padding the portrait video with a blurred version of the same video at an intensity of `400` and a brightness of `15`. 

![Rubik's portrait video with blurred background](https://res.cloudinary.com/demo/video/upload/b_blurred:400:15,c_pad,h_320,w_480/cld_rubiks_guy.mp4 "width:480, poster:https://res.cloudinary.com/demo/image/upload/h_320,w_480/rubik_poster.png")

```nodejs
cloudinary.video("cld_rubiks_guy", {background: "blurred:400:15", height: 320, width: 480, crop: "pad"})
```

```react
import { pad } from "@cloudinary/url-gen/actions/resize";
import { blurred } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("cld_rubiks_guy.mp4").resize(
  pad()
    .width(480)
    .height(320)
    .background(blurred().intensity(400).brightness(15))
);
```

```vue
import { pad } from "@cloudinary/url-gen/actions/resize";
import { blurred } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("cld_rubiks_guy.mp4").resize(
  pad()
    .width(480)
    .height(320)
    .background(blurred().intensity(400).brightness(15))
);
```

```angular
import { pad } from "@cloudinary/url-gen/actions/resize";
import { blurred } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("cld_rubiks_guy.mp4").resize(
  pad()
    .width(480)
    .height(320)
    .background(blurred().intensity(400).brightness(15))
);
```

```js
import { pad } from "@cloudinary/url-gen/actions/resize";
import { blurred } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("cld_rubiks_guy.mp4").resize(
  pad()
    .width(480)
    .height(320)
    .background(blurred().intensity(400).brightness(15))
);
```

```python
CloudinaryVideo("cld_rubiks_guy").video(background="blurred:400:15", height=320, width=480, crop="pad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('cld_rubiks_guy.mp4'))
	->resize(Resize::pad()->width(480)
->height(320)
	->background(
	Background::blurred()->intensity(400)
->brightness(15))
	);
```

```java
cloudinary.url().transformation(new Transformation().background("blurred:400:15").height(320).width(480).crop("pad")).videoTag("cld_rubiks_guy");
```

```ruby
cl_video_tag("cld_rubiks_guy", background: "blurred:400:15", height: 320, width: 480, crop: "pad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Background("blurred:400:15").Height(320).Width(480).Crop("pad")).BuildVideoTag("cld_rubiks_guy")
```

```dart
cloudinary.video('cld_rubiks_guy.mp4').transformation(Transformation()
	.resize(Resize.pad().width(480)
.height(320)
	.background(
	Background.blurred().intensity(400)
.brightness(15))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setBackground("blurred:400:15").setHeight(320).setWidth(480).setCrop("pad")).generate("cld_rubiks_guy.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().background("blurred:400:15").height(320).width(480).crop("pad")).resourceType("video").generate("cld_rubiks_guy.mp4");
```

```flutter
cloudinary.video('cld_rubiks_guy.mp4').transformation(Transformation()
	.resize(Resize.pad().width(480)
.height(320)
	.background(
	Background.blurred().intensity(400)
.brightness(15))
	));
```

```kotlin
cloudinary.video {
	publicId("cld_rubiks_guy.mp4")
	 resize(Resize.pad() { width(480)
 height(320)
	 background(
	Background.blurred() { intensity(400)
 brightness(15) })
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("cld_rubiks_guy", {background: "blurred:400:15", height: 320, width: 480, crop: "pad"})
```

```react_native
import { pad } from "@cloudinary/url-gen/actions/resize";
import { blurred } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("cld_rubiks_guy.mp4").resize(
  pad()
    .width(480)
    .height(320)
    .background(blurred().intensity(400).brightness(15))
);
```
## lpad (limit pad)

The `lpad` resize mode behaves the same as the `pad` mode but only if the original video is larger than the specified limit (width and height), in which case the video is scaled down to fill the specified dimensions while retaining the original aspect ratio and with all of the original video visible. This mode doesn't scale up the video if your requested dimensions are bigger than the original video's. If the proportions of the original video do not match the specified dimensions, padding is added to the video to reach the required size. You can also specify where the original video is placed by using the [gravity][gravity-link] parameter (set to `center` by default), and specify the color of the [background][background-color-link] in the case that padding is added.

**See full syntax**: [c_lpad](transformation_reference#c_lpad) in the _Transformation Reference_.

### Example 1: Scale down and pad a video

Limit the {variable:mediaName3} video to a bounding box of 400 x 150 pixels, and pad with a green background:

![Image lpadded to a width of 400 and height of 150 pixels](https://res.cloudinary.com/demo/image/upload/b_green,c_lpad,h_150,w_400/docs/camera.jpg "width: 400")

```nodejs
cloudinary.image("docs/camera.jpg", {background: "green", height: 150, width: 400, crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```python
CloudinaryImage("docs/camera.jpg").image(background="green", height=150, width=400, crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::limitPad()->width(400)
->height(150)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().background("green").height(150).width(400).crop("lpad")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", background: "green", height: 150, width: 400, crop: "lpad")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Background("green").Height(150).Width(400).Crop("lpad")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(400)
.height(150)
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setBackground("green").setHeight(150).setWidth(400).setCrop("lpad")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().background("green").height(150).width(400).crop("lpad")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(400)
.height(150)
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.limitPad() { width(400)
 height(150)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {background: "green", height: 150, width: 400, crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

![Video lpadded to a width of 400 and height of 150 pixels](https://res.cloudinary.com/demo/video/upload/b_green,c_lpad,h_150,w_400/guy_woman_mobile.mp4 "width: 400")

```nodejs
cloudinary.video("guy_woman_mobile", {background: "green", height: 150, width: 400, crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(background="green", height=150, width=400, crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::limitPad()->width(400)
->height(150)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().background("green").height(150).width(400).crop("lpad")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", background: "green", height: 150, width: 400, crop: "lpad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().Background("green").Height(150).Width(400).Crop("lpad")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(400)
.height(150)
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setBackground("green").setHeight(150).setWidth(400).setCrop("lpad")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().background("green").height(150).width(400).crop("lpad")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(400)
.height(150)
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.limitPad() { width(400)
 height(150)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {background: "green", height: 150, width: 400, crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(400)
    .height(150)
    .background(color("green"))
);
```

### Example 2: Scale down and pad a video using aspect ratio

Limit the {variable:mediaName3} video to a bounding box specified by an aspect ratio of 0.66 with a width of 100 pixels, and pad with a green background:

![Image lpadded to a width of 100 pixels and aspect ratio of 0.66](https://res.cloudinary.com/demo/image/upload/ar_0.66,b_green,c_lpad,w_100/docs/camera.jpg "width: 100")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="0.66", background="green", width=100, crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::limitPad()->width(100)
->aspectRatio(0.66)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("0.66").background("green").width(100).crop("lpad")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("0.66").Background("green").Width(100).Crop("lpad")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(100)
.aspectRatio(0.66)
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("0.66").setBackground("green").setWidth(100).setCrop("lpad")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("0.66").background("green").width(100).crop("lpad")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(100)
.aspectRatio(0.66)
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.limitPad() { width(100)
 aspectRatio(0.66F)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

![Video lpadded to a width of 100 pixels and aspect ratio of 0.66](https://res.cloudinary.com/demo/video/upload/ar_0.66,b_green,c_lpad,w_100/guy_woman_mobile.mp4 "width: 100")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="0.66", background="green", width=100, crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::limitPad()->width(100)
->aspectRatio(0.66)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("0.66").background("green").width(100).crop("lpad")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("0.66").Background("green").Width(100).Crop("lpad")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(100)
.aspectRatio(0.66)
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("0.66").setBackground("green").setWidth(100).setCrop("lpad")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("0.66").background("green").width(100).crop("lpad")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(100)
.aspectRatio(0.66)
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.limitPad() { width(100)
 aspectRatio(0.66F)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "0.66", background: "green", width: 100, crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(100)
    .aspectRatio(0.66)
    .background(color("green"))
);
```

### Example 3: Pad a video on all sides

Apply padding to all sides of the {variable:mediaName3} video by specifying a bounding box that's square, and has a width of 1.1 times the original width:

![Image padded on both sides](https://res.cloudinary.com/demo/image/upload/ar_1.0,b_green,c_lpad,w_1.1/docs/camera.jpg "thumb:c_scale,w_300, width:300")

```nodejs
cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", background: "green", width: "1.1", crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```python
CloudinaryImage("docs/camera.jpg").image(aspect_ratio="1.0", background="green", width="1.1", crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new ImageTag('docs/camera.jpg'))
	->resize(Resize::limitPad()->width(1.1)
->aspectRatio(1.0)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").background("green").width(1.1).crop("lpad")).imageTag("docs/camera.jpg");
```

```ruby
cl_image_tag("docs/camera.jpg", aspect_ratio: "1.0", background: "green", width: 1.1, crop: "lpad")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().AspectRatio("1.0").Background("green").Width(1.1).Crop("lpad")).BuildImageTag("docs/camera.jpg")
```

```dart
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(1.1)
.aspectRatio('1.0')
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setAspectRatio("1.0").setBackground("green").setWidth(1.1).setCrop("lpad")).generate("docs/camera.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").background("green").width(1.1).crop("lpad")).generate("docs/camera.jpg");
```

```flutter
cloudinary.image('docs/camera.jpg').transformation(Transformation()
	.resize(Resize.limitPad().width(1.1)
.aspectRatio('1.0')
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.image {
	publicId("docs/camera.jpg")
	 resize(Resize.limitPad() { width(1.1F)
 aspectRatio(1.0F)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/camera.jpg", {aspect_ratio: "1.0", background: "green", width: "1.1", crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryImage("docs/camera.jpg").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

![Video padded on both sides](https://res.cloudinary.com/demo/video/upload/ar_1.0,b_green,c_lpad,w_1.1/guy_woman_mobile.mp4 "thumb:c_scale,w_300, width:300")

```nodejs
cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", background: "green", width: "1.1", crop: "lpad"})
```

```react
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```vue
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```angular
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```js
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```

```python
CloudinaryVideo("guy_woman_mobile").video(aspect_ratio="1.0", background="green", width="1.1", crop="lpad")
```

```php
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Background;

(new VideoTag('guy_woman_mobile.mp4'))
	->resize(Resize::limitPad()->width(1.1)
->aspectRatio(1.0)
	->background(
	Background::color(Color::GREEN))
	);
```

```java
cloudinary.url().transformation(new Transformation().aspectRatio("1.0").background("green").width(1.1).crop("lpad")).videoTag("guy_woman_mobile");
```

```ruby
cl_video_tag("guy_woman_mobile", aspect_ratio: "1.0", background: "green", width: 1.1, crop: "lpad")
```

```csharp
cloudinary.Api.UrlVideoUp.Transform(new Transformation().AspectRatio("1.0").Background("green").Width(1.1).Crop("lpad")).BuildVideoTag("guy_woman_mobile")
```

```dart
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(1.1)
.aspectRatio('1.0')
	.background(
	Background.color(Color.GREEN))
	));
```

```swift
cloudinary.createUrl().setResourceType("video").setTransformation(CLDTransformation().setAspectRatio("1.0").setBackground("green").setWidth(1.1).setCrop("lpad")).generate("guy_woman_mobile.mp4")
```

```android
MediaManager.get().url().transformation(new Transformation().aspectRatio("1.0").background("green").width(1.1).crop("lpad")).resourceType("video").generate("guy_woman_mobile.mp4");
```

```flutter
cloudinary.video('guy_woman_mobile.mp4').transformation(Transformation()
	.resize(Resize.limitPad().width(1.1)
.aspectRatio('1.0')
	.background(
	Background.color(Color.GREEN))
	));
```

```kotlin
cloudinary.video {
	publicId("guy_woman_mobile.mp4")
	 resize(Resize.limitPad() { width(1.1F)
 aspectRatio(1.0F)
	 background(
	Background.color(Color.GREEN))
	 }) 
}.generate()
```

```jquery
$.cloudinary.video("guy_woman_mobile", {aspect_ratio: "1.0", background: "green", width: "1.1", crop: "lpad"})
```

```react_native
import { limitPad } from "@cloudinary/url-gen/actions/resize";
import { color } from "@cloudinary/url-gen/qualifiers/background";

new CloudinaryVideo("guy_woman_mobile.mp4").resize(
  limitPad()
    .width(1.1)
    .aspectRatio("1.0")
    .background(color("green"))
);
```## Device Pixel Ratio (DPR) {anchor:set_device_pixel_ratio_dpr}

Different devices support different DPR values, which is defined as the ratio between physical pixels and logical pixels. This means that a device with support for a higher DPR uses more physical pixels for displaying a video, resulting in a clearer, sharper video.

Use the `dpr` parameter to set the DPR value of the delivered video. The parameter accepts a numeric  value specifying the DPR multiplier. 

For example, the following URL dynamically generates the video scaled to a width of 100 pixels. Setting the `dpr` value to 1.0, 2.0 (as in the code example) or 3.0 generates the following videos, while resizing the video to match the required DPR.

[DPR 2.0 video](https://res.cloudinary.com/demo/video/upload/c_scale,w_100/dpr_2.0/guy_woman_mobile.mp4)

  
    
    
    
  
DPR 1.0

  
    
    
    
  
DPR 2.0

  
    
    
    
  
DPR 3.0

Now you can create an HTML video tag with the required dimensions and deliver a video with the resolution that best matches the specified pixel density of your users' devices. The three videos below are all displayed with a width of 200 pixels using the `<video>` tag width attribute, while you see more details and a better visual result for the last two videos (dpr 2 and dpr 3 respectively) if you view this documentation using a device that supports a higher DPR.

```html
<video poster="https://res.cloudinary.com/demo/video/upload/c_scale,w_200/dpr_2.0/guy_woman_mobile.jpg" width="200">
  <source src="https://res.cloudinary.com/demo/video/upload/c_scale,w_200/dpr_2.0/guy_woman_mobile.webm" type="video/webm"/>
  <source src="https://res.cloudinary.com/demo/video/upload/c_scale,w_200/dpr_2.0/guy_woman_mobile.mp4" type="video/mp4"/>
  <source src="https://res.cloudinary.com/demo/video/upload/c_scale,w_200/dpr_2.0/guy_woman_mobile.ogv" type="video/ogg"/>
</video>
```

  
    
    
    
  
DPR 1.0 (200 width, 331KB)

  
    
    
    
  
DPR 2.0 (400 width, 437KB)

  
    
    
    
  
DPR 3.0 (600 width, 474KB)

### How DPR affects transformations

The `dpr` parameter is more than a shortcut for multiplying the requested width or height. Cloudinary treats the specified dimensions as the intended logical display size and uses the DPR value to generate the required physical pixel dimensions. Some transformation settings are also adjusted relative to the DPR so that the displayed result remains visually consistent across devices.

For example, when adding a text overlay to a video, a DPR 2.0 video is delivered with twice the physical pixels and is then displayed at the intended logical size by the browser. Using `dpr` enables Cloudinary to size the text layer appropriately so the text appears at the intended visual size on higher-DPR devices.

The same principle applies to other transformations: image overlays and visual effects are scaled so the result looks the same regardless of DPR.
> **NOTE**: When setting a DPR value, you must also include a [crop/resize transformation](transformation_reference#c_crop_resize) specifying a certain width or height.
**See full syntax**: [dpr (DPR)](transformation_reference#dpr_dpr) in the _Transformation Reference_.

> **READING**:
>
> * [Video crop modes](video_crop_modes): Detailed examples of `fill`, `fill_pad`, and `crop` modes, plus cropping videos with non-standard DAR.

> * [Video gravity for crops](video_gravity): Control which part of the video is kept when cropping, using compass positions, face detection, and automatic gravity.

[gravity-link]:video_gravity
[background-color-link]:video_effects_and_enhancements#background_color