{"id":13880786,"url":"https://github.com/pikasojs/pikaso","last_synced_at":"2025-04-05T01:08:05.300Z","repository":{"id":39988484,"uuid":"312322980","full_name":"pikasojs/pikaso","owner":"pikasojs","description":"Seamless, headless and fully tested HTML5 Canvas library","archived":false,"fork":false,"pushed_at":"2024-05-03T22:38:43.000Z","size":3675,"stargazers_count":222,"open_issues_count":13,"forks_count":18,"subscribers_count":8,"default_branch":"master","last_synced_at":"2024-10-29T17:34:26.252Z","etag":null,"topics":["canvas","canvas-text-editor","crop","crop-image","cropper","fabric","filter-images","flip","image","image-editor","javascript","konvajs","pencil","react","rotate-image","shape","svg"],"latest_commit_sha":null,"homepage":"https://pikaso.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pikasojs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"custom":"https://revolut.me/raminmo"}},"created_at":"2020-11-12T15:47:57.000Z","updated_at":"2024-10-18T01:15:47.000Z","dependencies_parsed_at":"2023-02-08T06:01:12.894Z","dependency_job_id":"8ab2a7d8-e51c-4422-ac30-28760da46285","html_url":"https://github.com/pikasojs/pikaso","commit_stats":{"total_commits":332,"total_committers":4,"mean_commits":83.0,"dds":0.02409638554216864,"last_synced_commit":"159aeef83e8855a5a6163336d766295c740f4509"},"previous_names":[],"tags_count":21,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikasojs%2Fpikaso","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikasojs%2Fpikaso/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikasojs%2Fpikaso/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pikasojs%2Fpikaso/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pikasojs","download_url":"https://codeload.github.com/pikasojs/pikaso/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247271530,"owners_count":20911587,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["canvas","canvas-text-editor","crop","crop-image","cropper","fabric","filter-images","flip","image","image-editor","javascript","konvajs","pencil","react","rotate-image","shape","svg"],"created_at":"2024-08-06T08:03:28.926Z","updated_at":"2025-04-05T01:08:05.279Z","avatar_url":"https://github.com/pikasojs.png","language":"TypeScript","funding_links":["https://revolut.me/raminmo"],"categories":["TypeScript"],"sub_categories":[],"readme":"\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://user-images.githubusercontent.com/334716/158897748-f5cd569b-64b6-4551-be30-2d020b9efbde.svg\" /\u003e\n  \n  \u003ch3\u003ePikaso\u003c/h3\u003e\n  \u003cp\u003eSeamless, Fully-typed and Fully-tested HTML5 Canvas Library\u003c/p\u003e\n  \u003ca href=\"https://pikaso.app\"\u003e\u003cstrong\u003eLearn more »\u003c/strong\u003e\u003c/a\u003e\n  \u003cbr /\u003e\n  \u003cbr /\u003e\n  \n  \u003ca href=\"https://pikaso.app\"\u003eWebsite\u003c/a\u003e ·\n  \u003ca href=\"https://pikaso.app/api/classes/Pikaso.html\"\u003eAPI Documentation\u003c/a\u003e ·\n  \u003ca href=\"https://github.com/pikasojs/pikaso/issues\"\u003eIssues\u003c/a\u003e . \n  \u003ca href=\"https://github.com/pikasojs/pikaso/discussions\"\u003eDiscussion\u003c/a\u003e\n  \n  \u003cbr /\u003e\n  \u003cbr /\u003e\n  \n  ![Language](https://badgen.net/badge/icon/typescript?icon=typescript\u0026label=Language)\n  ![Test, Build and Publish](https://github.com/pikasojs/pikaso/workflows/Test/Build/Publish/badge.svg)\n  ![npm](https://badgen.net/npm/v/pikaso)\n  ![bundle](https://badgen.net/bundlephobia/minzip/pikaso)\n  [![quality](https://app.codacy.com/project/badge/Grade/f16b7c57dbbd4cdfa02b05f5ca04750a)](https://www.codacy.com/gh/pikasojs/pikaso/dashboard)\n  [![coverage](https://app.codacy.com/project/badge/Coverage/f16b7c57dbbd4cdfa02b05f5ca04750a)](https://www.codacy.com/gh/pikasojs/pikaso/dashboard) \n  \u003cbr /\u003e\n  \u003cbr /\u003e\n\u003c/div\u003e\n\n\n\n![2](https://user-images.githubusercontent.com/334716/158895397-e23b5d01-fd63-4db4-8f5d-174d9ddcac33.gif)\n\n## Install   \n\n#### NPM\n\nPikaso provides both ES module and CommonJS bundles, which is easy to use with the popular bundlers\n\n```js\nnpm install pikaso --save\n```\n\n#### Yarn\n```js\nyarn add pikaso\n```\n\n\n#### \u003cscript\u003e tag\n\nPikaso also supports UMD loading\n\n```js\n\u003csrcipt src=\"https://cdn.jsdelivr.net/npm/pikaso@latest/umd/pikaso.min.js\" type=\"text/javascript\" /\u003e\n```\n\n\n## Getting Started\n\n```js\nimport Pikaso from 'pikaso'\n\nconst editor = new Pikaso({\n  container: document.getElementById('\u003cYOUR_DIV_ID\u003e'),\n})\n```\n\n## React \nThis is possible to directly import the library or reuse the official hook   \nhttps://github.com/pikasojs/pikaso-react-hook\n\n## NodeJs\nPikaso comes with support for NodeJs out of the box.   \nUsing Pikaso in a NodeJs environment is similar to using it in a browser.   \n\n[https://pikaso.app/#/advanced/nodejs](https://pikaso.app/#/advanced/nodejs)\n\n\n\n## Features\n\n- [Fully Typed](https://github.com/pikasojs/pikaso/tree/master/src/types)\n- [Global Configurations](https://pikaso.app/#/getting-started/configuration)\n- [Fully Customizable Cropping](https://pikaso.app/#/core/cropper)\n- [Rotation and Transformation](https://pikaso.app/#/core/rotation)\n- [Shape and FreeStyle Drawing](https://pikaso.app/#/core/drawing)\n- [Built-in Shapes](https://pikaso.app/#/core/shapes)\n- [Groups](https://pikaso.app/#/core/groups)\n- [Interactive Text Editing](https://pikaso.app/#/core/label)\n- [Customizable Shapes](https://pikaso.app/#/advanced/create-custom-shapes)\n- [Image and SVG](https://pikaso.app/#/core/image)\n- [Background Image](https://pikaso.app/#/core/background)\n- [Event Management](https://pikaso.app/#/core/events)\n- [State Management (Undo/Redo)](https://pikaso.app/#/core/history)\n- [Flipping  ](https://pikaso.app/#/core/flip)\n- [Interactive Selection Management](https://pikaso.app/#/core/selection)\n- [Snap to Grid](https://pikaso.app/#/core/snap-grid)\n- [Measurement Tag](https://pikaso.app/#/core/measurement-tag)\n- [Export to PNG and JPEG](https://pikaso.app/#/core/import-export)\n- [Import/Export JSON](https://pikaso.app/#/core/import-export)\n- [Filters](https://pikaso.app/#/core/filters)\n- [Custom Filters](https://pikaso.app/#/advanced/create-custom-filters)\n- [NodeJs](https://pikaso.app/#/advanced/nodejs)\n\n  \n## Documentation\n[Full Documentation](https://pikaso.app)\n  \n## API references\n[Full API references](https://pikaso.app/api)\n  \n## Demos\n[React Setup](https://codesandbox.io/s/pikaso-react-hook-example-i0uwg)   \n[Vue 3 Setup](https://codesandbox.io/s/vue3-example-o3cig)   \n[Svelte Setup](https://svelte.dev/repl/b3e372de4b404f67b70ce047623f0efc?version=3.46.4)    \n[All Demos](https://pikaso.app)\n\n  \n### Pikaso vs. Konva\n[Konva](https://konvajs.org/docs/index.html) is a great HTML5 Canvas TypeScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.  \n\nPikaso is built on top of Konva to provide a couple of advanced features that Konva doesn't support out of the box.\n\n| Library |  |\n| - | - |\n| HTML5 Canvas | Provides low level APIs to draw graphics |\n| Konva | Provides Shapes, Dragging, Styling, Events, Transformation and Filters features to HTML5 canvas  |\n| Pikaso | Adds a lot of Simplicity and provides Free style and Shape Drawing, Advanced Shapes and Groups, State Management (Undo/Redo/Reset), JSON Import/Export, Text Editing, Cropping, Rotation, Transformation, Event Manager, Snap to Grid, Advanced Transformation and Selection, Flipping, Background Image and Background Overlay management, Filter Management to Konva |\n\n\n## Supporters\n[![Stargazers repo roster for @pikasojs/pikaso](https://reporoster.com/stars/pikasojs/pikaso)](https://github.com/pikasojs/pikaso/stargazers)\n\n  \n## License\nAccording to the terms of the [MIT license](LICENSE), Pikaso is freely distributable.\n\n[![FOSSA Status][fossa-large-image]][fossa-large-url]\n  \n[fossa-large-image]: https://app.fossa.io/api/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fpikasojs%2Fpikaso.svg?type=large\n[fossa-large-url]: https://app.fossa.io/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fpikasojs%2Fpikaso?ref=badge_large\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpikasojs%2Fpikaso","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpikasojs%2Fpikaso","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpikasojs%2Fpikaso/lists"}