ImgPen image editor

Images are an essential part of the content. When you prepare articles for publishing, be that your blog or a serious internet magazine, you face the need to modify an image, for example, crop, rotate, or resize it. ImgPen image editor can do this for you.

The component involves all possible functionality to process images. Seamless integration with Flmngr file manager allows you to upload and save edited images to your server. You can find the complete description of its functions in the table below.

Image Editor toolbar screenshot
Image editor toolset
Crop tool screenshot
Crop tool
Tools to add text, a color picker and font family screenshot
Tools to add text, a color picker, and font family

Features and buttons

Crop button
Crop photo to one of the specified aspect ratios or let a user select custom crop zone via the UI
Resize button
Use pixel-by-pixel control with maintaining pixel aspect ratio to adjust an image to the exact dimensions you need
  • Maintain Aspect Ratio
  • Use Percenteges
Transform button
Rotate an image clockwise or counter-clockwise, flip horizontally or vertically
  • Free rotation of the image using a slider
  • Rotate 90° CW
  • Rotate 90° CCW
  • Flip Horizontal
  • Flip Vertical
Corners button
Round corners of the image using UI
Filters button
Adds effects to an image such as grayscale, sharpen, vintage, sepia, blur and more
Custom filter settings:
  • Remove Color (the filter offers the color picker and distance options)
  • Brightness (adjust brightness level using the slider)
  • Gamma (manual correction of Blue, Green, Red channels)
  • Noise (noise intensity)
  • Pixelate (sets the level of pixelation for an image)
  • Blend (configures the alpha-channel)
Draw button
A tool for freehand drawing
  • Color picker
  • Brush types
  • Brush size
Text button
A tool to add text
  • Color picker
  • Font family
All objects are in their own layers and can be easily moved, deleted or modified.
Additional settings:
  • Flip horizontally/vertically
  • Shadow
  • Outline
  • Color
  • Background
  • Texture
  • Gradient
  • Opacity
  • Text style
Shapes button
A tool to add shapes (circle, rectangle, triangle, ellipse, line, etc.)
Stickers button
Available categories: emoticons, doodles, landmarks, stars, clouds, bubbles, transport, beach
Save mode A mode to save all changes in the image save/cancel
Zoom The canvas can be scaled using the mouse and also with the +/- button on the top panel
Undo/Redo Any changes in the image can be undone or redone

The option Edit image with ImgPen is avilable from several places:

  1. The Edit image button on the CKEditor or TinyMCE toolbar is active if the image is selected

    Button Edit image on toolbar

  2. The Edit button on the sidebar or in the editing dialog image widgets

    Edit image button on the sidebar

  3. In Flmngr: before you insert an image to the content, you can edit it

    Edit image button in File Manager