Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

nhn/tui.image-editor

Repository files navigation

Full featured image editor using HTML5 Canvas. It's easy to use and provides powerful filters.

github version npm version license PRs welcome code with hearth by NHN Cloud lerna

πŸ“¦ Packages

6 -20-2018 17-45-54

🚩 Table of Contents

🌏 Browser Support

Chrome Chrome IE Internet Explorer Edge Edge Safari Safari Firefox Firefox
Yes 10+ Yes Yes Yes

πŸ’ͺ Has full features that stick to the basic.

Photo manipulation

  • Crop, Flip, Rotation, Drawing, Shape, Icon, Text, Mask Filter, Image Filter

Integration function

  • Download, Image Load, Undo, Redo, Reset, Delete Object(Shape, Line, Mask Image...)
Crop Flip Rotation Drawing Shape
2018εΉ΄06月04ζ—₯ 4 33 16 2018εΉ΄06月04ζ—₯ 4 40 06 2018εΉ΄06月04ζ—₯ 4 43 02 2018εΉ΄06月04ζ—₯ 4 47 40 2018εΉ΄06月04ζ—₯ 4 51 45
Icon Text Mask Filter
2018εΉ΄06月05ζ—₯ 2 06 29 2018εΉ΄06月05ζ—₯ 2 14 36 2018εΉ΄06月05ζ—₯ 2 20 46 2018εΉ΄06月05ζ—₯ 2 27 10

Powerful filter function

  • Grayscale, Invert, Sepia, Blur Sharpen, Emboss, RemoveWhite, Brightness, Noise, Pixelate, ColorFilter, Tint, Multiply, Blend
Grayscale Noise Emboss Pixelate
grayscale noise emboss pixelate
Sepia Sepia2 Blend-righten Blend-diff Invert
sepia sepia2 blend-righten blend-diff invert
Multifly Tint Brightness Remove-white Sharpen
multifly tint brightness remove-white sharpen

πŸ™† Easy to apply the size and design you want

Can be used everywhere.

  • Widely supported in browsers including IE10.

  • Option to support various display sizes. (allows you to use the editor features on your web pages at least over 550 * 450 sizes)

    2018εΉ΄06月04ζ—₯ 5 35 25

Nice default & Fully customizable Themes

  • Has a white and black theme, and you can modify the theme file to customize it.
  • Has an API so that you can create your own instead of the built-in.
black - top black - bottom white - left white - right
2018εΉ΄06月05ζ—₯ 1 41 13 2018εΉ΄06月05ζ—₯ 1 40 24 2018εΉ΄06月05ζ—₯ 1 41 48 2018εΉ΄06月05ζ—₯ 1 42 27

🎨 Features

  • Load image to canvas
  • Undo/Redo (With shortcut)
  • Crop
  • Flip
  • Rotation
  • Resize
  • Free drawing
  • Line drawing
  • Shape
  • Icon
  • Text
  • Mask Filter
  • Image Filter

πŸ”§ Pull Request Steps

TOAST UI products are open source, so you can create a pull request(PR) after you fix issues. Run npm scripts and develop yourself with the following process.

Setup

Fork develop branch into your personal repository. Clone it to local computer. Install node modules. Before starting development, you should check if there are any errors.

$ git clone https://github.com/{your-personal-repo}/[[repo name]].git
$ cd [[repo name]]
$ npm install

Pull Request

Before uploading your PR, run test one last time to check if there are any errors. If it has no errors, commit and then push it!

For more information on PR's steps, please see links in the Contributing section.

πŸ“™ Documents

πŸ’¬ Contributing

πŸ”© Dependency

🍞 TOAST UI Family

πŸš€ Used By

πŸ“œ License

MIT LICENSE

About

🍞🎨 Full-featured photo image editor using canvas. It is really easy, and it comes with great filters.

Topics

Resources

License

Code of conduct

Contributing

Stars

Watchers

Forks

Packages

No packages published

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /