Editing and transformations

Last updated: Sep-28-2023

Cloudinary offers a selection of transformation and editing tools to cater to various needs and preferences. You can choose the tool that best aligns with your specific circumstances.

This table describes the various options:

Option Description Considerations
Transformation templates A set of pre-defined transformations that you can apply to an asset. ✅ Simplifies your workflow by eliminating the need to repeatedly specify individual transformations when applying the same ones
✅ Ensures consistency by always applying the same set of transformations
✅ Easy to apply with one click
✅ Allows you to preview before downloading it or opening it in a browser window
💡 If you want to add or modify a transformation template, ask your administrator
Media editors A separate image and video editor that allows you to make basic edits on your images and trim your videos. ✅ Allows you to freely apply your own edits to individual assets
✅ Enables overwriting the original asset or saving as a new original
✅ Offers a real-time preview of the changes you make
✅ Provides a user friendly interface
Transformation and Asset Details Editor

OR

Advanced Editor

Both provide user interfaces for transforming original assets or applying additional transformations to assets that have already undergone previous transformations Transformation and Asset Details Editor:
✅ Enables viewing backed up versions and derived assets, and overriding automatic image quality
✅ Supports all transformations

Advanced Editor
✅ Enables you to save your changes by either overriding the original asset or creating a new one.
💡 Supports most common transformation actions. If the transformation action you are trying to apply is not listed, you can specify it using transformation syntax

Studio An intuitive, user-friendly interface for applying transformations and AI-driven actions to multiple images ✅ Easy and pleasant to use
✅ Simplifies your workflow by allowing you to apply transformations in bulk
✅ Provides the ability to create templates, download variations, or open them in a browser
✅ Makes Cloudinary's powerful AI capabilities super accessible
💡 Some actions are subject to subscription limits or count against your monthly quota

Transformation templates

For Assets users
The transformation templates feature is a premium feature for our Assets product, and its availability depends on your account setup. If transformation templates is not yet enabled for your account and you'd like to enable it, please contact your Customer Support Manager.

Applying a transformation template to an asset generates a transformed asset, which is a copy of the original, modified according to the pre-defined transformations set in the transformation template.

Your organization likely has standards for formatting, sizing, watermarking, cropping assets, etc. If you're repeatedly making the same adjustments to your assets, then transformation templates can reduce repetition in your workflow, while ensuring that organizational standards are met.

Several transformation templates are provided by default. Your administrator can replace these with their own, up to a maximum of 30, by:

  • Saving transformations created in Studio as templates.
  • Setting named transformations as transformation presets.
    Note
    If you can't preview assets when applying a certain transformation preset, it may be because:
    • The preset wasn't defined correctly (for example a video preset with a transformation that's only valid for images).
    • The preset contains a transformation that's not supported for preview. If a preset can't be previewed, ask your administrator to make sure the preset was set up correctly.

      In either case, you can still download the asset or open it in a new tab.

Previewing transformed assets

In the Download Options tab of the asset management drill-down page, several transformation templates are listed, enabling you to see how the selected asset would look with those transformations applied.

Download Options tab

For Nexus users
If you have Nexus, you can additionally download your asset resized to fit one of several social media platform requirements, such as Instagram, Facebook and Twitter.

You can click the template thumbnail to preview the transformed asset. For any displayed transformation template, you can perform operations such as opening the transformed asset in a new tab, downloading it, copying the URL, or further editing the it in the transformation editor or Advanced Editor.

Tip
When you click a transformation template in the Download Options tab of the asset management drill-down page to preview an asset with that template, it doesn't count against your transformation quota. However, the first time someone views that transformation template for a specific asset outside the Media Library (open in a browser tab, download, etc.), a derived asset is generated and counts like any other transformation.

Downloading a single transformed asset

In any Media Library view, i.e., Assets, Folders, Collections, and Moderation, you can download a single asset in several different forms, including its original and with a transformation template applied. From the (3-dot) options menu on the asset, open the Download nested menu and click on the transformation template you want to apply on download.

Download a single transformed asset

Downloading transformed assets in bulk

In any Media Library view, i.e., Assets, Folders, Collections, and Moderation, you can download multiple assets together, with the same transformation template applied. Select the desired assets and hover over the Download icon in the assets toolbar. All the available transformation templates are listed under Templates. Choose one to generate a ZIP file with transformed assets.

Download transformed assets in bulk

Media editor

From the asset management drill-down page, you can navigate to a Media Editor for images.

The Media Editor enables you to make various types of edits on your images.

When you're finished with your edits, you can either:

  • Download the edited version without modifying the original.
  • Click Save to overwrite the original asset with your edited version while keeping its metadata. If backups are enabled for your product environment, then you'll be able to easily revert to a previous version if needed.

For Assets and Nexus users
  • The Media editor feature is a premium feature for our Assets product, and its availability depends on your account setup. If the Media editor is not yet enabled for your account and you'd like to enable it, please contact your Customer Support Manager.
  • If you have Nexus, you can additionally click Save As to save the edited version as a new asset with the same metadata and in the same folder as the original. You can use the public ID that was generated for you based on the original asset with a random suffix added, or you can enter your own unique public ID.

Edit images

When an image is displayed in the asset management drill-down page, you can click the Edit pull-down button and select the Edit Image action to open the Media Editor for images.

From this view, you can easily crop an uploaded image based on one of the available crop preset aspect ratios, manually set a required crop width and height, or just manually resize the image using the crop handlebars. You can also choose to flip or rotate the image.

DAM Media Editor for images

Media Editor for images

Tip
When manually setting width and height values, the aspect ratio is locked by default. If you want to adjust the crop to other sizes, toggle the icon to unlock the aspect ratio.

The options in the Media Editor enable you to easily make these simple modifications without an external editing tool or the need to request a designer's assistance.

Trim videos (Nexus only)

When a video is displayed in the asset management drill-down page, you can click the Edit pull-down button and select the Trim Video action to open the Media Editor for videos.

From this view, you can easily take off part of the beginning or end of a video clip. Move the left or right handles of the slider to trim your video.

DAM Media Editor for videos

Media Editor for videos

Transformation and Asset Details Editor

The Edit page enables you to experiment with the various transformations available for the selected image or video using simple UI elements in the transformation editor and to view and edit asset details.

Note
Depending on your account setup, and if your administrator enabled the Transformation Builder (Beta) for early access, you'll have access to the new Advanced Editor (Transformation Builder) instead of the Transformation and Asset Details Editor.

To open the Edit page:

From the asset management drill-down page, select the Edit icon from the URL bar.

OR

Select Edit from the (3-dot) options menu on the asset itself. (This navigation option to the Transformation Editor isn't available for images if you've opted in for early access to Studio.)

Navigate to the Edit page

Using the transformation editor

Edit transformation UI

The most common transformations are displayed on the page. There are 3 additional links you can click to create more complex transformations:

  • More options: Set additional transformations or transformation flags.
  • Add overlay & watermark: Specify another asset in your Media Library to add as an overlay (or underlay) on the current asset, and specify transformations to apply to the selected overlay asset. You can also click the More options link within the overlay section to access additional transformations for the overlay.
  • Chain another transformation: Chaining enables you to define another set of transformations that will be applied on the result of the first set.

When you change settings on any of the transformation controls, a button is displayed on the preview prompting you to refresh the preview so that you can see the new variation of your asset. In most cases, it makes sense to first set all the transformation settings you want to apply, and only then refresh the preview. When you refresh the preview, the transformation code displayed below the preview is also updated, enabling you to copy the transformation URL or the transformation code for any SDK.

If you use the asset variation outside the Media Library (open in a browser tab, download, etc.), a derived asset is generated from the original asset based on applied transformations. It doesn't change the original asset, nor is it treated as a new asset in your Media Library. You can view all derived assets that were generated from a particular asset by clicking the View derived image/video button at the top of the Edit page.

Notes
  • When you modify a transformation and refresh the preview to view the resulting variation of the asset, you're not billed for previewing it. However, if you use the variation outside the Media Library (for example opening it in a new tab or downloading it) a 'derived asset' is generated and counted as part of the total number of transformations used during your billing cycle.
  • Because transformations do not impact the original asset, users with the Media Library user role can generate transformations, even if they have only Can View or Can Contribute permissions for the folder where the asset is stored.
  • The options on this page enable you to apply most of the available transformations, but not all of them. Some of the more complex transformations with many possible option values can be applied only using the delivery URL API.

For details on all available transformations and how they are used within delivery URLs, see the Image transformations and Video transformations guides.

Editing asset details

From the Edit page, users with a role that includes edit permissions for the asset can adjust data that is stored with your asset, including:

  • Add or edit face or custom coordinates. These coordinates are used to determine the area of focus for cropping, overlays, and other transformation features when the gravity parameter is set to face/faces or custom in a delivery URL.
  • Set an override quality level for a specific asset. The absolute quality level set here will be used for that asset instead of Cloudinary's auto-quality algorithm when quality is set to auto in a delivery URL.
  • List, preview and restore backed up versions. With backup enabled, uploaded assets are copied to a backup location and version history is maintained if an asset is overwritten or deleted. You can preview previous versions, even for deleted assets, helping you to choose which version to restore.

Users with an Admin role or with Can Manage permissions for the relevant folder can also Delete the asset.

Advanced Editor (Transformation Builder) early access

If the Transformation Builder (Beta) is enabled for early access by your administrator, you can utilize the Advanced Editor (Transformation Builder) to create variations of the selected image or video. Create variations of your asset by applying transformations using the user-friendly UI elements.

Important
The Advanced Editor (Transformation Builder) is currently in Beta, which means there may be minor changes in functionality or appearance before its general access release. We value your feedback, so please feel free to share any thoughts with us.

For Assets users
The Advanced Editor (Transformation Builder) is a premium feature for our Assets product, and its availability depends on your account setup. If the Advanced Editor (Transformation Builder) opt-in option is not available to your administrator in the early access section of the Media Library Preferences and you'd like to enable this feature, contact your Customer Support Manager.

To open the Advanced Editor:

From the asset management drill-down page, select the Edit icon from the URL bar.

OR

Select Advanced Editor from the (3-dot) options menu on the asset itself. (This navigation option to the Advanced Editor isn't available for images if you've opted in for early access to Studio.)

Navigate to the Advanced Editor

by selecting the Advanced Editing action from either the Edit pull-down button on the asset management drill-down page or the (3-dot) options menu on the asset. You can

The new Transformation Builder offers the same capabilities as the Transformation editor with an improved, simple and easy to use interface, and has support for most common transformation actions. If the transformation action you are trying to apply is not listed, you can add an Additional Transformation action to specify your transformation.

The additional functionality offered by the new Transformation Builder can streamline your workflow. Previously, when applying transformations to an asset using the Transformation Editor, you were only able to preview it, download it, or open it in a new tab. Now, with the new Transformation Builder, you can also easily save the asset variation to change/overwrite the original asset in the Media Library. In addition, you can save an image variation as a new asset.

The following sections help you get started with the Transformation Builder, and show how to work with several transformations. Follow the steps shown in the animations, or follow the written instructions below each animation. The written steps walk you through the process shown in each animation, with some additional clarifications.

How to apply transformations:


Jump to this spot in the video  0:00 To open the Transformation Builder, from the Manage page, select Advanced Editing (Transformation Builder) from the Edit Image drop-down (or, you can select Advanced Editing from the (3-dots) options menu of the asset you want to edit).
Jump to this spot in the video  0:06 Click Start Creating.
Jump to this spot in the video  0:08 If it's the first transformation you're adding, select a transformation from the Select Action pane.
Jump to this spot in the video  0:13 Depending on the action you select, there may be additional options that you can set. (You can click Discard changes to revert any transformations that you haven't yet applied.)
Jump to this spot in the video  0:24 If you've already added a transformation, you can add another transformation by clicking + Add Action from the Transformation pane to display the Select Action pane.
Jump to this spot in the video  0:34 Click Apply to add the new transformation to the URL and preview the asset with transformations applied. (Click Apply and Close to also close the Select Action pane.)


How to delete a transformation:


From the Transformation pane, open the (3-dots) options menu next to the transformation you want to delete and click Delete.

How to apply an image overlay:


Jump to this spot in the video  0:00 From the Transformation pane, click + Add Action.
Jump to this spot in the video  0:07 From the Select Action pane, select Image Layer.
Jump to this spot in the video  0:11 Enter the Public ID of the image you want to overlay, and set the other available options (Type, what to Focus on, Placement, X/Y Offset, and Blend Mode), and apply those settings.
Jump to this spot in the video  0:35 To further format the overlay if it's, for example, too big, select +Add Layer Action.
Jump to this spot in the video  0:38 From the Select Action pane, select the transformation you want to apply to the image overlay, set any additional options for that transformation, and click Apply to add the new transformation to the overlay and preview the applied transformations.

You can repeat the last two steps to add more transformations to your overlay until it looks how you want it to.


How to apply an unlisted transformation:


Jump to this spot in the video  0:00 From the Transformation pane, click + Add Action.
Jump to this spot in the video  0:08 From the Select Action pane, click Additional Transformations.
Jump to this spot in the video  0:12 Add the string that specifies the transformation you want to add. Follow the examples to enter a valid transformation, or look up the available transformation options with examples and syntax details in the Transformation reference.


How to copy the URL, download, or save your transformation:


Once you're satisfied with the variation you've generated by applying your desired transformations, save the changes you made to overwrite the original asset keeping the original metadata, download your derived asset, or copy the URL to the derived asset and open in a new tab. If you're working with an image, you can save the variation as a new original in the same folder and with the same metadata.

Studio (images only)

An intuitive, user-friendly interface for applying transformations and AI-driven actions to multiple images. Create variations that you can download or deliver. Administrators can additionally save transformations as templates for future use when images are downloaded.

Keep in mind that any transformations you make in Studio, as well as any templates applied later on, will create asset variations without altering the original asset. This means that even users with Can view permissions can use Studio.

For Assets users

The Studio feature is a premium feature for our Assets product, and its availability depends on your account setup. If Studio is not yet enabled for your account and you'd like to enable it, please contact your Customer Support Manager.

To open Studio for multiple images:

Select multiple images and hover over the Open Studio icon in the asset toolbar. From the drop-down menu, choose the tool you want to apply:

Open multiple images in studio

To open Studio for a single image:

Hover over Edit from the (3-dot) options menu on the image itself and select the action you want to start with from the nested menu:

Open a single image in studio

Note
You can include additional images individually while in Studio by clicking Add more.

Applying AI actions and transformations

You can toggle between two views. One shows the images in a grid layout and the other pins one of the images in the center with the others showing as thumbnails. Click any thumbnail to pin it in the center.

Studio enables you to perform any of the following transformation actions on your assets:

  • Crop: Easily resize your image to a specific width and height. You can also use AI to automatically focus on the most interesting area and scale the image accordingly.
  • Flip and rotate: Flip and rotate your images with one click.
  • Remove Background: Effortlessly remove the background from your selected image(s), add a drop shadow and choose a background color or image.
    Important
    Background removal, powered by an add-on with specific limits, counts against your monthly quota when applied within Studio. If you've reached your monthly cap and need to remove more backgrounds, contact your administrator to upgrade your subscription.
  • Overlay Image: Add an overlay image of your choice from your product environment. Customize its width, placement in one of the four corners, and opacity.
  • Remove Objects (Beta): Enter a prompt to identify and remove up to three objects across all assets in Studio (AI powered).
  • Enhance: Instantly improve your image by adjusting colors, contrast, brightness, and sharpness. Highlight edges and fine details for a visually enhanced result.

You can combine most transformation actions, except for background removal and object removal, which can't be applied together.

Here's an example of a transformation that consists of several actions: cropping to a width and height of 40 px and adding an overlay image:

Studio

You can also compare the asset variation created in Studio with the original assets. Press and hold the button to view the original asset, and release it to see the asset with your applied transformations.

Using your creations

When you're satisfied with your transformations, you can:

  • Download the asset variations you created as a ZIP file.
  • Download the delivery URLs of your variations as a CSV file.
  • Copy the URL of an individual variation from its kebab menu.
  • If you're an administrator, you can save the transformations you created as a template from the kebab menu at the top right corner. Templates can be easily applied when downloading single and multiple images, and previewed from the asset management drill-down page.
    Note
    Administrators can alternatively create templates using the full range of Cloudinary transformation options by setting named transformations as transformation presets.

Important

Transformation actions applied within Studio don't count against your monthly quota. However, downloading or opening the image with its deliver URL in a new browser does. If you're downloading a large number of assets, be mindful of your usage. Consider upgrading your plan with your administrator's assistance if you've reached the limit.

✔️ Feedback sent!

Rate this page: