Image Editor / Default Functionalities

Blazor Image Editor Example - Default Functionalities

Loading Syncfusion Blazor Server Demos…

1

This sample demonstrates the default rendering of the Blazor Image Editor with minimal configuration. It highlights the built-in editing workflow, toolbar actions, and output formats available out of the box.

The Image Editor provides rich, client-side APIs to modify images interactively or programmatically. You can perform region-based operations, annotate content, fine-tune appearance, and export results in multiple formats. Keyboard and mouse interactions are optimized for precise editing, and the component is responsive across devices.

  • Selection – Square/circle regions with adjustable aspect ratios; resize and drag for precise selection.
  • Crop – Crop the image to the current selection.
  • Rotate – Rotate clockwise or counterclockwise in 90° steps.
  • Flip – Flip horizontally or vertically.
  • Zoom and Pan – Inspect details and navigate the canvas efficiently.
  • Freehand drawing – Draw on the image; control stroke width and color.
  • Annotation – Add text, rectangle, ellipse, arrow, path, image, and line shapes; manage Z-order for layered designs.
  • Finetunes – Adjust brightness, contrast, hue, saturation, and blur.
  • Filters – Apply presets such as chrome, cold, warm, grayscale, sepia, and invert.
  • Frames – Add predefined frames like mat, bevel, line, hook, and inset.
  • Resize – Scale images to fit specific dimensions or constraints.
  • Redact – Obscure sensitive regions for privacy and compliance.
  • Reset – Revert edits to the original image state.
  • Save – Export as JPEG, PNG, or SVG.
Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE