Cloudinary
ImageKit can translate transformations written in Cloudinary's syntax to ImageKit's syntax. Learn how to use a URL-rewriter on this page.
Beta feature This feature is currently in beta. Some transformations may not work as expected.

Supported Transformations

The following Cloudinary transformations are supported for translation:
Cloudinary transform
Example translation
Remarks
width
  • w_100 => w-100
height
  • h_100 => h-100
aspect ratio
  • ar_2.5 => ar-2.5-1
  • ar_3 => ar-3-1
  • ar_4:3 => ar-4-3
gravity
  • g_north => fo-top
  • g_center => fo-center
  • g_auto => fo-auto
  • g_face => fo-face
Supported values:
  • north
  • south
  • east
  • west
  • north_west
  • north_east
  • south_east
  • south_west
  • auto
  • custom
  • face
x
  • x_100 => x-100
y
  • y_100 => y-100
format
  • f_jpg => f-jpg
Supported values:
  • auto
  • jpg
  • jpeg
  • png
  • webp
  • gif
  • avif
quality
  • q_60 => q-60
angle
  • a_90 => rt-90
  • a_-67 => rt-N67
effects
  • e_grayscale => e-grayscale
  • e_contrast:100 => e-contrast
  • e_sharpen:500 => e-sharpen-5
  • e_unsharp_mask:500 => e-usm-0-5-1-0.05
  • e_unsharp_mask:250 => e-usm-0-2.5-1-0.05
Supported values:
  • grayscale
  • contrast
  • sharpen
  • unsharp_mask
Final output from ImageKit may vary from output from Cloudinary
border
  • bo_5px_solid_red => b-5-red
  • bo_5px_solid_BLUE => b-5-blue
  • bo_5px_solid_rgb:AAAA54 => b-5-AAAA54
  • bo_5px_solid_rgb:AAAA54A9 => b-5-AAAA5466
  • bo_5px_solid_rgb:B4F => b-5-BB44FF
  • bo_5px_solid_rgb:B4F9 => b-5-BB44FF60
  1. 1.
    Color values are case insensitive
  2. 2.
    Alpha values in RGB codes are accepted in the range [00-FF] and translated to a value in the range [00-99]
background
  • b_red => bg-red
  • b_BLUE => bg-blue
  • b_rgb:AAAA54 => bg-AAAA54
  • b_rgb:AAAA54A9 => bg-AAAA5466
  • b_rgb:B4F => bg-BB44FF
  • b_rgb:B4F9 => bg-BB44FF60
  1. 1.
    Color values are case insensitive
  2. 2.
    Alpha values in RGB codes are accepted in the range [00-FF] and translated to a value in the range [00-99]
colorize
  • co_red => otc-red
  • co_BLUE => otc-blue
  • co_rgb:AAAA54 => otc-AAAA54
  • co_rgb:AAAA54A9 => otc-AAAA5466
  • co_rgb:B4F => otc-BB44FF
  • co_rgb:B4F9 => otc-BB44FF60
  1. 1.
    Only supported in the context of text overlays
  2. 2.
    Color values are case insensitive
  3. 3.
    Alpha values in RGB codes are accepted in the range [00-FF] and translated to a value in the range [00-99]
DPR
  • dpr_3.0 => dpr-3.0
crop
  • c_crop => cm-extract
  • c_fill => c-maintain_ratio
  • c_fit => c-at_max
  • c_pad => cm-pad_resize
  • c_scale => c-force
Supported values:
  • crop
  • fill
  • fit
  • pad
  • scale
text overlays
  • l_text:Roboto_50:<value> => ot-<value>,otf-Roboto,ots-50
  • l_text:Roboto_50_bold_left:<value> => ot-<value>,otf-Roboto,ots-50,ott-b,otia-left
  • l_text:<fontPath>_50_bold_left:<value> => ot-<value>,otf-<fontPath>,ots-50,ott-b,otia-left
Supported text style qualifiers:
  • bold
  • italic
  • left
  • right
  • center
  • start
  • end
Custom fonts can be used by specifying full path to a font file in your Media Library
image overlays
  • l_<imagePath> => oi-<imagePath>
Full path to the overlaid image in the Media Library must be specified
named transform
  • t_<transform_name> => n-<transform_name>
ImageKit does not translate the actual underlying transformations associated with your named transforms. They must be manually translated and added in your ImageKit dashboard while retaining the same name.
fl_layer_apply
Marks the end of a group of transformations being applied in the context of an overlay. ImageKit detects the presence of an fl_layer_apply and applies the relevantly positioned transforms to the overlaid asset instead of the main asset.
Note: The rewriter will silently ignore any transformation that has a valid key, but with an invalid value. For example, h_100,w_<invalid>/a_90 will be translated to h-100:rt-90. Refer to the table to see what constitutes a valid value for different transforms.
Copy link