We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
The Angular Image Editor is a UI component for editing and enhancing images. With built-in support for cropping, rotating, flipping, zooming, and applying filters, this component makes it easy to fine-tune your edits to achieve the desired results. Additionally, the Angular Image Editor allows users to annotate images with shapes such as rectangles, ellipses, lines, and text, as well as freehand drawings.
The Angular Image Editor makes it easy to get a perfect crop every time using multiple selection options, including square, circle, and customizable aspect ratios. Easily drag and resize the selection region to precisely crop the desired area of the image.
Allows users to draw a custom selection rectangle on an image that can be repositioned by dragging and resizing it to get the desired selection.
Crop images into perfect square regions or maintain the aspect ratios of the images.
Crop images into perfect circular regions.
Customize selection regions for cropping your images according to predefined aspect ratios, including 4:3, 7:5, 16:9, and more.
The Image Editor has multiple annotation tools, including text, freehand drawings, and shapes like rectangles, ellipses, and lines.
Users can add a text to an image using the text annotation tool, which allows them to add captions, labels, or other types of text-based information. The text annotation can be inserted anywhere on the image and customized by changing its color, font family, font size, and font styles such as bold and italic.
Add hand-drawn content to an image using a mouse or touch. With the freehand drawing annotation, users can customize the pen color and stroke width to suit their needs. Also, the freehand drawing annotation can be used in combination with other annotation tools, such as text and shapes, to create rich, annotated images.
Add shapes, such as rectangles, ellipses, and lines, to an image. With the shape annotation tool, customize the border color, fill color, and border width of the shapes.
The Image Editor has built-in support for transforming images in various ways, including rotating, flipping, and zooming.
Users can rotate images with annotations clockwise or counterclockwise.
Flip images with annotations horizontally or vertically useful for creating a mirror image of the original image.
Users can adjust the size of an image by zooming in or out to fine-tune their edits and achieve the exact results. The pan tool can also be used to reveal hidden areas of an image.
Easily load an image into the Angular image editor using a base 64 string or URL, with support for PNG, JPEG, and SVG image formats.
Offers a wide range of tools for annotating, selecting, cropping, zooming, panning, rotating, flipping, filtering, and more, enabling users to fully edit and manipulate their images. Additionally, users can customize the toolbar by defining their own items or the entire toolbar.
Save the image as a base 64 string, or choose from PNG, JPEG, or SVG formats.
For a seamless experience on all devices, the Angular Image Editor includes a responsive mode that adapts the UI for mobile devices and offers a great user experience on phones, tablets, and desktops.
With its extensive set of APIs, developers can control the appearance and behaviors of the Image Editor to suit their needs.
The Angular Image Editor features built-in themes such as Bootstrap 5, Tailwind CSS, Fluent, high contrast, and more. Users can customize these themes or create their own using SASS variables or the Theme Studio application to achieve the desired look and feel.
In addition to Angular, the Image Editor component is also available for the React, Vue, and JavaScript frameworks. You can access the component on these platforms using the links below.
Documentation
Greatness—it’s one thing to say you have it, but it means more when others recognize it. Syncfusion is proud to hold the following industry awards.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
