hunk.code_window:           "resolved": "https://registry.npmjs.org/@uppy/tus/-/tus-1.6.0.tgz",
             "integrity": "sha512-cRQ5Qw87SNS4b2v+UfjUW5uAVx4nv6pj9I0cu6ys8x+t7NjVo3cOjaT4Bns1/xxy6xzWv/4WT0LbG5h+NNGNMA==",
             "requires": {
               "@types/tus-js-client": "^1.8.0",
               "tus-js-client": "^1.8.0"
             }
           },
           "buffer-from": {
             "version": "0.1.2",
  
hunk.labels: keep keep keep add keep keep keep keep keep
hunk.after_edit:             "@uppy/companion-client": "^1.5.0",
               "@uppy/utils": "^3.1.0",
  
hunk.file_path: package-lock.json
hunk.type: add
file: ---
  title: "Image Editor 🌈"
  date: 2020-07-21
  author: arturi
  image: "https://uppy.io/images/blog/1.18-image-editor/image-editor-dashboard.jpg"
  published: true
  ---
  
  One of the most-requested Uppy features, the [Image Editor](/docs/image-editor/), has landed (as beta) in 1.18.
  
  <video alt="Demo video showing Uppy with Image Editor plugin — cropping, rotating and resizing images" poster="https://uppy.io/images/blog/1.18-image-editor/image-editor-dashboard.jpg" muted autoplay loop>
    <source src="/images/blog/1.18-image-editor/image-editor-demo.mp4" type="video/mp4">
    Your browser does not support the video tag: https://uppy.io/images/blog/1.18-image-editor/image-editor-demo.mp4
  </video>
  
  <!--more-->
  
  The editor currently supports cropping, resizing, rotating, flipping and zooming your images in and out. You can try it out on [the Dashboard example page](/examples/dashboard/).
  
  Under the hood we are using the excellent open source (just like Uppy itself) [Cropper.js](https://fengyuanchen.github.io/cropperjs/) library.
  
  ```sh
  npm install @uppy/image-editor
  ```
  
  ```js
  const Uppy = require('@uppy/core')
  const Dashboard = require('@uppy/dashboard')
  const ImageEditor = require('@uppy/image-editor')
  
  const uppy = new Uppy()
  uppy.use(Dashboard)
  uppy.use(ImageEditor, { 
    target: Dashboard,
    quality: 0.8 // for the resulting image, 0.8 is a sensible default
  })
  ```
  
  ![Uppy with Image Editor plugin screenshot — cropping, rotating and resizing images](https://uppy.io/images/blog/1.18-image-editor/image-editor-dashboard.jpg)
  
  The Image Editor plugin is meant to be used with the Dashboard UI, but in theory it can work without it, rendered somewhere else. This has not been tested, try at your own risk ;-)
  
  You can [override the options from Cropper.js](https://uppy.io/docs/image-editor/#cropperOptions), too. Check out [the docs for up to date options and events](https://uppy.io/docs/image-editor).
  
  Please leave your feedback [on Twitter](https://mobile.twitter.com/uppy_io/status/1285532376249110528).
  
  <blockquote class="twitter-tweet"><p lang="en" dir="ltr">🖼 One of the most-requested Uppy features, the Image Editor, for cropping, resizing, rotating, flipping and zooming your images is live now! <br><br>Check it out: <a href="https://t.co/dDXRoW0HGj">https://t.co/dDXRoW0HGj</a> <a href="https://t.co/IhYo0gwtvP">pic.twitter.com/IhYo0gwtvP</a></p>&mdash; Uppy (@uppy_io) <a href="https://twitter.com/uppy_io/status/1285532376249110528?ref_src=twsrc%5Etfw">July 21, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 
  