Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Resize and crop to achieve the desired width and height
Crops the image to specified dimensions (width and height) while keeping proportions and delivers the resulting image via CDN.
func=crop
This is the default resizing mode when both width and height operations are used. You do not need to specify func=crop explicitly.
Preview | Syntax |
---|---|
Specifies which part of the image you wish to keep while cropping. If you omit the gravity option, central cropping is performed.
gravity=X
Chooses the most important image features and objects and sets the focal point on them when cropping.
gravity=smart
gravity=auto
gravity=face
Sets the crop focal point on the people in the image or on the most prominent featues if no faces are detected. Useful for creating thumbnails from images with different aspect ratios.
Preview | Syntax |
---|---|
If you prefer to use the legacy automatic crop, just set gravity operation to auto.
Preview | Syntax |
---|---|
When using gravity=face, all images with one dominant face are focused on this face upon cropping. If there are many or no faces in the image, gravity falls back to auto.
If you would like to try and include multiple faces in the image, you can use gravity=smart
Do not upscale an image if target size is larger than the origin image
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
northwest
north
northeast
west
center | centre (default)
east
southwest
south
southeast
auto - more info
face - more info
smart - more info
X,Y - more info
Allow upscaling (default): /docs/ny_doc.jpg?w=450
Prevent upscaling: /docs/ny_doc.jpg?w=450&org_if_sml=1
Crop operation which removes faces from the top of the image
Crops out the topmost part of an image if it contains a face.
To control the margin when cropping the face out, you can use the face_margin=Y operation where Y is a percentage of the face height. Its default value is 20. You can also use negative numbers if you would like to keep part of the face.
func=facehide
Preview | Syntax |
---|---|
Crop operation focusing only on one face
Finds the most prominent face in the image and crops it to specified dimension provided with the width and height parameters. If you however provide only one dimension, the other dimension will be chosen automatically to keep the aspect ratio of the face.
func=face
If there is no face in the image or many faces are found, the operation defaults to a standard crop.
Preview | Syntax |
---|---|
Sets margins around the face. You can set equal margins with face_margin=X or separate horizontal and vertical margins (face_margin=W,H).
face_margin=X|W,H
Preview | Syntax |
---|---|
Resize with minimum size constraints (to fill a box)
Resizes an image while bounding the smaller dimension to the desired width or height while keeping proportions. Delivers the resulting image via CDN.
func=boundmin
Please note that the larger dimension of the resized image will be equal or greater than the dimensions set in the URL. If you would like to fit the image to set width and height, you should use either or .
Preview | Syntax |
---|
Crop by boundary coordinates
Allows to crop an image by providing the cropping area. It is useful when you want to crop a specific part of the image. To set the coordinates of the crop rectangle, use the tl_px and br_px operations.
tl_px=X1,Y1
br_px=X2,Y2
Original image:
Fits the image in a box with padding when needed
Preview | Syntax |
---|
Positionable crop can be combined with all available resize functions - , , , or . This operation is performed after the positionable crop.
Preview | Syntax |
---|
gravity | gravity=X
| sets the position of the image in the fit box |
solid background | bg_color=X | bg_colour=X
| defines a background color with a hex code, color name or automatically, based on the image palette |
blurred background | bg_img_fit=1 | sets blurred image background |
bg_blur=X | applies Gaussian blur to the background image |
bg_opacity=X
| specifies background image opacity |
bg_colourise=X | bg_colorize=X | defines a color to tint the background image |
northwest | north | northeast |
west | center | centre (default) | east |
southwest | south | southeast |
Standard crop: /docs/business-portfolio.jpg?w=400&h=300
Face crop: /docs/classroom.jpg?h=240&w=380&func=face
Face crop with automatic aspect ratio: /docs/classroom.jpg?h=240&func=face
Delivers the optimal size based on device pixel-ratio
Allows you to deliver the right image dimensions according to a defined device pixel ratio. This operation can help with conversion between device-independent pixels and CSS (reference) pixels. Useful in responsive image solutions using the srcset html attribute. Allows positive values limited to 5.
dpr=X
Preview | Syntax |
---|---|
Resize ignoring proportions
Basic image resizing operations
Resizing operations enable the dynamic generation of image transformations to meet various web delivery use cases. Operations focus on the image size while allow to modify the image itself.
Operation | Syntax | Description |
---|---|---|
Do not hesitate to contact us if you need any additional operations not listed above
When you specify both width and height, original image proportions can be either ignored or maintained. Also, you may choose to add padding to the image to fill the blank space.
Filerobot supports the following resize function (operation func).
Keeps image proportions cutting the image to fit the defined width and height; see
This resizing function removes parts of the image and is the default behaviour when both width and height are defined. Read further for other resizing functions.
Resizes the image keeping proportions and adding padding to satisfy the desired dimensions; see
Performs either #cropor #fit based on image dimensions and transformation parameters; see
This resizing function may remove parts of the image
Fits image in a box of defined size without adding padding; see
The boundmin operation is a special case of bound where the smaller dimension is respected instead of the larger one, see
Resizes the image to the given width and height ignoring original image proportions, thus distorting the image; see
For troubleshooting purposes, use the ci_info=1 operation to view details about resizing and compression, for example: /docs/hotel.jpg?w=400&ci_info=1
Setting crop gravity with focal point coordinates
Allows to crop an image by defining the coordinates of the crop focal point. It is useful when you want to crop images where the coordinates of the point of interest are already known.
To set the coordinates of the focal point, use the gravity=X,Y operation where X and Y are the coordinates of the focal point (in pixels). Alternatively, you can set the coordinates as a percentage of the original image - gravity=Xp,Yp or gravity=xc,yc, where X,Y=0..100 and x,y=0..1.
gravity=X,Y
gravity=Xp,Yp|xc,yc
Original image: /docs/castle.jpg?w=1000
Please note that the focal point in gravity=X,Y has to be defined as coordinates X and Y of the full-sized origin image and not the scaled-down version.
Automatic crop or fit based on origin dimensions
Performs either or operation depending on the origin image and the desired transformation dimensions.
If the desired image is smaller than the original, the result is cropped to achieve the desired dimensions.
func=cropfit
Preview | Syntax |
---|---|
If you include the operation in the URL, the image will be trimmed first (if possible) and then either cropped or fitted to the desired size.
Preview | Syntax |
---|---|
Image trimming
Removes any single-color padding around the image if present.
The parameter does not specify the amount of border or frame to trim but rather how aggressive the trim algorithm should be. A bigger value of the parameter (e.g. 25) will trim rather more than not enough. Typical values are between 0 and 10.
This allows you to use the same parameter values for all your images.
trim=X
If the image is resized with the width and/or height commands, the resizing is performed after the border (if present) is trimmed.
Preview | Syntax |
---|
Solid background:
Automatic solid background:
Blurred background:
Blurred background, tinted:
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
Preview | Syntax |
---|---|
width=X
sets the image width to X pixels
height=X
sets the image height to X pixels
org_if_sml=1
prevents resizing if the target size is larger than the origin image
func=crop
sets crop resize function
gravity=X
defines the part of the image to be retained when cropping X = [north | south][east | west] | auto | X,Y
tl_px=X,Y
sets coordinates of the top left corner of the cropping rectangle
br_px=X,Y
sets coordinates of the bottom right corner of the cropping rectangle
func=face
crops the image automatically focusing on the most prominent face
func=fit
sets fit resize function
func=cropfit
sets crop or fit resize function depending on the origin and the desired dimensions
func=bound
sets bound resize function
func=boundmin
bounds the image to the larger dimension
func=cover
sets cover resize function (distorts image proportions)
flip=[h][v]
mirrors the image horizontally and/or vertically
r=X
rotates the image to X degrees (counterclockwise)
trim=X
trims any solid-color border (if present); X is the aggressiveness of the operation
radius=X
applies rounded corners and optionally fills the empty background with a color
650x500 origin image, cropped: /docs/classroom.jpg?func=cropfit&w=500&h=350&bg_colour=auto
Same parameters, 400x250 origin image: /docs/ny_doc.jpg?func=cropfit&w=500&h=350&bg_colour=auto
No dpr parameter (assumed dpr=1): /docs/birds.jpg?w=400
Device pixel ratio 1.75: /docs/birds.jpg?w=400&dpr=1.75
Flip horizontally: /docs/flat_hd.jpg?w=400&flip=h
Flip both horizontally and vertically: /docs/flat_hd.jpg?w=400&flip=hv
Original image (650x500 pixels): /docs/classroom.jpg
Cropfit to 500x350: /docs/classroom.jpg?func=cropfit&w=500&h=350&bg_color=auto
Original image (400x250 pixels): /docs/ny_doc.jpg
Cropfit to 500x350: /docs/ny_doc.jpg?func=cropfit&w=500&h=350&bg_color=auto
Original image: /docs/sofa.jpg
Cropfit + trim: /docs/sofa.jpg?func=cropfit&trim=0&w=500&h=350&bg_colour=auto
Original image: |
Trimmed image: |
Original image: |
Trimmed image: |
Transparent corners (default, if the formats supports transparency): |
Solid color corners: |
Crop by aspect ratio or aspect ratio range.
Sets target aspect ratio or aspect ratio range when cropping. Aspect ratios can be set as decimal values (1.778) or ratios (16:9).
aspect_ratio=AR | ar=AR
aspect_ratio=AR1,AR2 | ar=AR1,AR2
If you provide only one dimension parameter (width or height) and aspect_ratio, the other dimension will be calcualted. If you include both width and height in the URL, aspect_ratio is ignored.
If you provide only aspect_ratio and no dimensions (width or height), the image will be cropped without resizing.
Preview | Syntax |
---|---|
You can spcify a range of aspect ratio, for example aspect_ratio=4:3,16:9. Images which fall within this range, will not be cropped. Useful to avoid very wide ot very tall images by cropping them to the closest aspect ratio.
Original aspect ratio (3:2 or 1.5): /docs/car1.jpg?w=400
Cropped to 1.8: /docs/car1.jpg?w=400&aspect_ratio=1.8
Original aspect ratio (1.323): /docs/frog.png
Cropped to 3:2 (1.5): /docs/frog.png?aspect_ratio=3:2
Original aspect ratio 1.5: /docs/car1.jpg?w=400
Aspect ratio range 1.5..2 (no crop needed): /docs/car1.jpg?w=400&aspect_ratio=1.5,2.0
Original aspect ratio 2.25:1 (2.25): /docs/kids.jpg?w=400
Aspect ratio range 3:2..2:1 (1.5..2): /docs/kids.jpg?w=400&aspect_ratio=3:2,2:1