Width - (w)
Used to specify the width of the output video. Accepts integer value greater than 1.
You can also provide an arithmetic expression such as iw_div_2
, cw_mul_0.8
, or ih
as a value for this parameter. Doing so will first calculate the value of the expression and then apply transformations using that value. Learn more about arithmetic expressions here.
When you specify just width, the height is adjusted accordingly to maintain the aspect ratio.
https://ik.imagekit.io/demo/sample-video.mp4
https://ik.imagekit.io/demo/sample-video.mp4?tr=w-300
Notice that the height is automatically adjusted to maintain the aspect ratio.
To reduce the width to half, use the following URL. https://ik.imagekit.io/demo/sample-video.mp4?tr=w-iw_div_2
Height - (h)
Used to specify the height of the output video. Accepts integer value greater than 1.
You can also provide an arithmetic expression such as ih_div_2
, ch_mul_0.5
, or ih
as a value for this parameter. Doing so will first calculate the value of the expression and then apply transformations using that value. Learn more about arithmetic expressions here.
When you specify only height, the width is adjusted accordingly to maintain the aspect ratio.
https://ik.imagekit.io/demo/sample-video.mp4
https://ik.imagekit.io/demo/sample-video.mp4?tr=h-300
Notice that the width is automatically adjusted to maintain the aspect ratio.
To reduce the height to 40 percent of original, use the following URL. https://ik.imagekit.io/demo/sample-video.mp4?tr=h-ih_mul_0.4
Aspect ratio - (ar)
Used to specify the aspect ratio of the output video. It is the ratio of width to height of the output video. This parameter must be used along with either the height(h) or width(w) parameter but not both.
You can also provide an arithmetic expression such as iar_div_2
, or car_mul_0.75
as a value for this parameter. Doing so will first calculate the value of the expression and then apply transformations using that value. Learn more about arithmetic expressions here.
Usage = ar-<width>-<height>
If you specify both height(h) and width(w) in the URL along with aspect ratio(ar), then the aspect ratio is ignored.
URL - https://ik.imagekit.io/demo/sample-video.mp4
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=ar-4-1,h-100
To double the aspect ratio with width 400px, use the following URL. https://ik.imagekit.io/demo/sample-video.mp4?tr=w-400,ar-iar_mul_2
Crop, Crop Modes, and Focus
If only, one of the height(h) or width(w) is specified, then ImageKit.io adjusts the other dimension accordingly to preserve aspect ratio and no cropping takes place.
But when you specify both height(h) and width(w) dimensions, you need to choose the right cropping strategy based on your website layout and desired output video.
Tip for choosing the right cropping strategy
When choosing among different strategies for cropping, think in terms of your website layout and desired output video dimension.
- If you want to preserve the whole video content without any cropping and need the exact same dimensions (height and width) in the output as requested, choose either the pad resize crop or forced crop strategy.
- If you want to preserve the whole video content without any cropping, but it is okay if one or both the dimensions (height or width) in the output are adjusted to preserve the aspect ratio. Then choose either the max-size cropping or min-size cropping strategy.
- If you need the exact same dimensions (height and width) in the output video as requested but it's okay to crop the video to preserve the aspect ratio. Then choose either the maintain ratio crop or the extract crop strategy. You can combine the extract crop strategy with different focus values to get the desired result.
Pad resize crop strategy - (cm-pad_resize)
In the pad resize crop strategy, the output dimension (height and width) is the same as requested, no cropping takes place, and the aspect ratio is preserved. This is accomplished by adding padding around the video to get it to match the exact dimension as requested.
Example - All padding on one side
In the examples above, we saw that when the video is padded using the pad resize crop strategy, the padding is equal on both sides of the video. However, there might be cases where we want all the padding to be added on only one side of the video. This can be done using the focus (fo) parameter.
https://ik.imagekit.io/demo/sample-video.mp4?tr=w-400,h-200
The video is 400x200 but it is cropped from all sides to preserve the aspect ratio.
https://ik.imagekit.io/demo/sample-video.mp4?tr=w-400,h-200,cm-pad_resize,bg-F3F3F3
The video is exactly 400x200 and there is no cropping. Extra padding with background color F3F3F3 has been added to get 400x200 output dimensions.
https://ik.imagekit.io/demo/sample2.mp4?tr=w-400,h-200,cm-pad_resize,bg-blurred
The video is exactly 700x700 and there is no cropping. The extra padding added consists of a blurred background made using the source video to get 400x200 output dimensions.
You can also control the focus point using fo parameter to move the actual content to one side using relative positioning.
We added the fo-left
. Now, all the padding is on the right of the video.
Forced crop strategy - (c-force)
In a forced crop strategy, the output video's dimension (height and width) is exactly the same as requested, no cropping takes place, but the aspect ratio is not preserved. It forcefully squeezes the original video to get it to fit completely within the output dimensions.
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=w-200,h-200,c-force
Notice that the aspect ratio is changed and the video looks squeezed.
Max-size cropping strategy - (c-at_max)
In the max-size crop strategy, the whole video content is preserved without any cropping, and the aspect ratio is preserved, but one of the dimensions (height or width) is adjusted.
The output video is less than or equal to the dimensions specified in the URL,i.e., at least one dimension will exactly match the output dimension requested, and the other dimension will be equal to or smaller than the corresponding output dimension requested.
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=w-200,h-200,c-at_max
Notice that the aspect ratio is maintained, and there is no cropping. However, the height is reduced so that the video fits within a 200x200 container.
Min-size cropping strategy - (c-at_least)
This strategy is similar to the max-size cropping strategy, with the only difference being that, unlike the max-size strategy, the output video dimension is equal to or larger than the requested dimensions. One of the dimensions will be exactly the same as what is requested, while the other dimension will be equal to or larger than what is requested.
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=w-200,h-200,c-at_least
Notice that the height is 200px as requested, but the width is more than 200px. The aspect ratio is maintained and there is no cropping.
Maintain ratio crop strategy - (c-maintain_ratio)
This is the default crop strategy. If no crop (c
) or crop_mode (cm
) is specified in the URL, c-maintain_ratio
gets applied automatically.
In this strategy, the output video's dimensions (height and width) are the same as requested, and the aspect ratio is preserved. This is accomplished by resizing the video to the requested dimension and then cropping extra parts to get the desired height & width.
By default, ImageKit.io crops the video from the center, but you can change this using the focus parameter.
URL - https://ik.imagekit.io/demo/sample-video.mp4
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=w-400,h-300,c-maintain_ratio
w-400,h-300,c-maintain_ratio
is equivalent to w-400,h-300
because maintain_ratio
is the default crop strategy.
Notice that the video's dimension matches 400x300, but the content is cropped from all edges, i.e., by default, ImageKit will extract the video from the center.
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=w-400,h-300,c-maintain_ratio,fo-left
Using the focus (fo
) parameter, you can specify the side to crop from.
Here the video's dimension matches 400x300 and crops out the content on right side, because focus (fo
) is set to left
.
Extract crop strategy - (cm-extract)
In this strategy, the output video's dimension (height and width) is exactly the same as requested, and the aspect ratio is preserved. In this strategy, instead of trying to resize the video as we did in maintain ratio strategy, we extract out a region of the requested dimension from the original video.
By default, ImageKit.io extracts the video from the center but you can change this using the focus parameter.
Examples - Center and relative focus
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=h-300,w-300,cm-extract
A 300x200 part is extracted from the center of the original video.
In the relative method, you can use the focus (fo) parameter to specify that the extract should be done from, let's say, the bottom of the original video.
URL - https://ik.imagekit.io/demo/sample-video.mp4?tr=h-300,w-300,cm-extract,fo-bottom
Focus - (fo)
This parameter can be used along with pad resize, maintain ratio or extract crop to change the behavior of padding or cropping. Learn more from the different examples shown in respective sections.
This parameter can have the following values depending upon where it is being used:
left
,right
,top
,bottom
can be to control the position of padding when used with pad resize. Learn from example.center
,top
,left
,bottom
,right
,top_left
,top_right
,bottom_left
andbottom_right
can be used to define relative cropping during extract crop. Learn from examples.
Apart from the above, the fo
parameter also has additional options that intelligently focus on the most important portion or a specific object in the video. Learn more about video smart crop
Video smart crop
In a video, the important part of the frame can shift as the timeline progresses. Using video smart crop, you can crop the video so the important parts stay in view across the timeline.
To apply smart crop, use the fo
(focus) parameter to specify what we should to follow in the video. For this fo
support 3 families of values:
- Automatic smart crop (
fo-auto
) - Identifies all important objects in a video, and focuses at the weighted average of their spatial location. - Face crop (
fo-face
) - Focus on a face in the video. (Chooses most prominent face when multiple faces are present) - Object-aware crop - Mention any one COCO class objects (example:
fo-person
,fo-boat
orfo-ball
).
For face crop (fo-face
) and object crop (fo-<object>
), if you omit w
and h
, we automatically determine the width and height needed to keep the object covered throughout the video. You can adjust the aspect ratio of determined width & height using the aspect-ratio(ar
) parameter.
You can explicitly define c-maintain_ratio
(default) or cm-extract
, when using smart-crop with defined width & height — whether using combination of w
+h
, w
+ar
or h
+ar
parameters.
All other crop modes (defined with c
or cm
) are invalid.
Examples of automatic smart crop
https://ik.imagekit.io/demo/birthday.mov
https://ik.imagekit.io/demo/birthday.mov?tr=fo-auto,w-540,ar-3_4
https://ik.imagekit.io/demo/birthday.mov?tr=fo-auto,w-720,h-720,cm-extract
cm-extract
cuts out a 720×720
, centered on the important area (fo-auto).
When you use fo-auto
, you must lock the output dimensions. Provide both width (w
) and height (h
), or supply one of them (w
or h
) with aspect-ratio (ar
).
Examples of face crop
dontopen://ik.imagekit.io/demo/play-time.mp4
dontopen://ik.imagekit.io/demo/play-time.mp4?tr=fo-face
dontopen://ik.imagekit.io/demo/play-time.mp4?tr=fo-face,ar-9_16
Adjusts the crop width and height to match 9:16
aspect ratio, while centering the face.
dontopen://ik.imagekit.io/demo/play-time.mp4?tr=fo-face,w-400,h-600,cm-extract
Examples of object-aware crop
dontopen://ik.imagekit.io/demo/roadtrip.mp4
dontopen://ik.imagekit.io/demo/roadtrip.mp4?tr=fo-bus
dontopen://ik.imagekit.io/demo/roadtrip.mp4?tr=fo-person
Video smart crop FAQ
Where is video smart crop feature available?
Video smart crop is available for video transformations and video overlays (l-video
). Smart crop is not supported when input video's codec is av1
, mpeg1video
, or mpeg2video
.
You can place GIF files in video layers if you want them as overlays, but smart crop itself is not supported for GIF inputs right now.
Smart crop is supported for image transformations (including image overlays via l-image
). Learn more
However, in video transformations, smart crop is not available for image overlays (l-image
).
How to use video smart crop in chained transformations?
Smart crop can only be performed on a video once. That is only at first step of the chained transformations.
Invalid: dontopen://ik.imagekit.io/demo/birthday.mov?tr=b-10_red:fo-person
Valid: dontopen://ik.imagekit.io/demo/birthday.mov?tr=fo-person:b-10_red
If you use smart crop inside a video layer (l-video
), it must also be the first step within that layer’s chained transformations.
Invalid: dontopen://ik.imagekit.io/demo/sample-video.mp4?tr=l-video,i-birthday.mov,b-10_red:fo-person,l-end
Valid: dontopen://ik.imagekit.io/demo/sample-video.mp4?tr=l-video,i-birthday.mov,fo-person:b-10_red,l-end
As best practice we recommend applying follow-up transformation, in later steps (separated by :
).
Learn more about chained transformations
How to use rotate (rt
) with video smart crop?
You cannot use rt
in the same step as smart crop.
dontopen://ik.imagekit.io/demo/birthday.mov?tr=fo-person,rt-90
is invalid.
If you want to rotate (or transpose) a video after applying smart crop, use chained transformation (separated the parameters with a :
).
dontopen://ik.imagekit.io/demo/birthday.mov?tr=fo-person:rt-90
will first crop around the person
in the video, and then rotate the result.
Learn more about chained transformations
Can you use arithmetic expressions in transformations with video smart crop?
No. In fact arithmetic expressions are completely unsupported anywhere in the transformations, when video smart crop is used. Use explicit numeric values instead.
You can use arithmetic expressions with smart crop in image transfomations.
How much does video smart crop cost?
The cost of video smart crop is charged based on the duration of the final video output and how many smart-crop operations you request via the fo
parameter.
Imagekit charges for video smart crop in VPUs (Video Processing Units). In practice we calculate the VPU based on formula below:
(Duration of the final video output in seconds) * (Number of smart-crop requested via 'fo' parameter) * (VPU cost of 1 second of SD video output)
If, Input is an audio file or vc-none
is used on the transformation, it means there is no video to perform smart crop on. In this case, video smart crop operation is skipped and no VPU is charged for it.
Learn more about video transformation pricing
Video smart crop is a separate service, this feature & its limitations only applicable for video-transformations. It is separate from Imagekit's AI related services for images.