{"id":"5ba6a306-3c90-4b20-85d8-ed367cc48a71","shortId":"UXApHw","kind":"skill","title":"Konva.js HTML5 Canvas Interactive Graphics Framework","tagline":"Konva.js is an HTML5 Canvas JavaScript framework that enables high-performance animations, transitions, node nesting, layering, filtering, caching, and event handling for desktop and mobile applications. With over 14,000 GitHub stars, it provides an interactive object model on to","description":"# Konva.js HTML5 Canvas Interactive Graphics Framework\n\nKonva.js is an HTML5 Canvas JavaScript framework that enables high-performance animations, transitions, node nesting, layering, filtering, caching, and event handling for desktop and mobile applications. With over 14,000 GitHub stars, it provides an interactive object model on top of the HTML5 Canvas element with bindings for React and Vue.\n\n## Installation\n\nUse the upstream install or setup path that matches your environment:\n- npm install konva --save\n- npm install konva canvas\n- npm install konva skia-canvas\n- To make a full build run npm run build. The command will compile all typescript files, combine then into one bundle and run minifier.\n\nRequirements and caveats from upstream:\n- [![Build Status](https://github.com/konvajs/konva/actions/workflows/test-node.yml/badge.svg)](https://github.com/konvajs/konva/actions/workflows/test-node.yml)\n- Konva is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.\n- # node-canvas backend\n\nBasic usage or getting-started notes:\n- Konva works in all modern mobile and desktop browsers. A browser need to be capable to run javascript code from ES2015 spec. For older browsers you may need polyfills for missing functions.\n- bash\n- javascript\n\n- Source: https://github.com/konvajs/konva\n- Extracted from upstream docs: https://raw.githubusercontent.com/konvajs/konva/HEAD/README.md\n\n## Source\n\n- [Agent Skill Exchange](https://agentskillexchange.com/skills/konva-js-html5-canvas-interactive-graphics-framework/)","tags":["konva","html5","canvas","interactive","graphics","framework","skills","agentskillexchange","agent-skills","ai-agents","ai-tools","awesome-list"],"capabilities":["skill","source-agentskillexchange","skill-konva-js-html5-canvas-interactive-graphics-framework","topic-agent-skills","topic-ai-agents","topic-ai-tools","topic-awesome-list","topic-claude-code","topic-codex","topic-cursor","topic-llm","topic-mcp","topic-npx-skills","topic-openclaw","topic-skills-catalog"],"categories":["skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/agentskillexchange/skills/konva-js-html5-canvas-interactive-graphics-framework","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add agentskillexchange/skills","source_repo":"https://github.com/agentskillexchange/skills","install_from":"skills.sh"}},"qualityScore":"0.454","qualityRationale":"deterministic score 0.45 from registry signals: · indexed on github topic:agent-skills · 8 github stars · SKILL.md body (1,669 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T19:11:04.316Z","embedding":null,"createdAt":"2026-05-18T13:17:23.776Z","updatedAt":"2026-05-18T19:11:04.316Z","lastSeenAt":"2026-05-18T19:11:04.316Z","tsv":"'/konvajs/konva':242 '/konvajs/konva/actions/workflows/test-node.yml/badge.svg)](https://github.com/konvajs/konva/actions/workflows/test-node.yml)':165 '/konvajs/konva/head/readme.md':249 '/skills/konva-js-html5-canvas-interactive-graphics-framework/)':256 '000':37,84 '14':36,83 'agent':251 'agentskillexchange.com':255 'agentskillexchange.com/skills/konva-js-html5-canvas-interactive-graphics-framework/)':254 'anim':19,66,177 'applic':33,80,190 'backend':197 'bash':237 'basic':198 'bind':101 'browser':213,215,229 'build':136,140,161 'bundl':152 'cach':25,72,183 'canva':3,11,50,58,98,125,131,170,196 'capabl':219 'caveat':158 'code':223 'combin':148 'command':142 'compil':144 'desktop':30,77,187,212 'doc':246 'element':99 'enabl':15,62,174 'environ':117 'es2015':225 'event':27,74,184 'exchang':253 'extract':243 'file':147 'filter':24,71,182 'framework':6,13,53,60,172 'full':135 'function':236 'get':202 'getting-start':201 'github':38,85 'github.com':164,241 'github.com/konvajs/konva':240 'github.com/konvajs/konva/actions/workflows/test-node.yml/badge.svg)](https://github.com/konvajs/konva/actions/workflows/test-node.yml)':163 'graphic':5,52 'handl':28,75,185 'high':17,64,175 'high-perform':16,63 'html5':2,10,49,57,97,169 'instal':106,110,119,123,127 'interact':4,43,51,90 'javascript':12,59,171,222,238 'konva':120,124,128,166,205 'konva.js':1,7,48,54 'layer':23,70,181 'make':133 'match':115 'may':231 'minifi':155 'miss':235 'mobil':32,79,189,210 'model':45,92 'modern':209 'much':192 'need':216,232 'nest':22,69,180 'node':21,68,179,195 'node-canva':194 'note':204 'npm':118,122,126,138 'object':44,91 'older':228 'one':151 'path':113 'perform':18,65,176 'polyfil':233 'provid':41,88 'raw.githubusercontent.com':248 'raw.githubusercontent.com/konvajs/konva/head/readme.md':247 'react':103 'requir':156 'run':137,139,154,221 'save':121 'setup':112 'skia':130 'skia-canva':129 'skill':252 'skill-konva-js-html5-canvas-interactive-graphics-framework' 'sourc':239,250 'source-agentskillexchange' 'spec':226 'star':39,86 'start':203 'status':162 'top':94 'topic-agent-skills' 'topic-ai-agents' 'topic-ai-tools' 'topic-awesome-list' 'topic-claude-code' 'topic-codex' 'topic-cursor' 'topic-llm' 'topic-mcp' 'topic-npx-skills' 'topic-openclaw' 'topic-skills-catalog' 'transit':20,67,178 'typescript':146 'upstream':109,160,245 'usag':199 'use':107 'vue':105 'work':206","prices":[{"id":"d7544548-8395-4ecd-b587-ff4c1c277899","listingId":"5ba6a306-3c90-4b20-85d8-ed367cc48a71","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"agentskillexchange","category":"skills","install_from":"skills.sh"},"createdAt":"2026-05-18T13:17:23.776Z"}],"sources":[{"listingId":"5ba6a306-3c90-4b20-85d8-ed367cc48a71","source":"github","sourceId":"agentskillexchange/skills/konva-js-html5-canvas-interactive-graphics-framework","sourceUrl":"https://github.com/agentskillexchange/skills/tree/main/skills/konva-js-html5-canvas-interactive-graphics-framework","isPrimary":false,"firstSeenAt":"2026-05-18T13:17:23.776Z","lastSeenAt":"2026-05-18T19:11:04.316Z"}],"details":{"listingId":"5ba6a306-3c90-4b20-85d8-ed367cc48a71","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"agentskillexchange","slug":"konva-js-html5-canvas-interactive-graphics-framework","github":{"repo":"agentskillexchange/skills","stars":8,"topics":["agent-skills","ai-agents","ai-tools","awesome-list","claude-code","codex","cursor","llm","mcp","npx-skills","openclaw","skills-catalog"],"license":"mit","html_url":"https://github.com/agentskillexchange/skills","pushed_at":"2026-05-18T19:02:17Z","description":"The open catalog of AI agent skills — 2,000+ security-scanned skills for Claude Code, Cursor, Codex, and more.","skill_md_sha":"4af36d34f99ad9f145c6073276ac93605fb9c88f","skill_md_path":"skills/konva-js-html5-canvas-interactive-graphics-framework/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/agentskillexchange/skills/tree/main/skills/konva-js-html5-canvas-interactive-graphics-framework"},"layout":"multi","source":"github","category":"skills","frontmatter":{"name":"Konva.js HTML5 Canvas Interactive Graphics Framework","description":"Konva.js is an HTML5 Canvas JavaScript framework that enables high-performance animations, transitions, node nesting, layering, filtering, caching, and event handling for desktop and mobile applications. With over 14,000 GitHub stars, it provides an interactive object model on top of the HTML5 Canvas element with bindings for React and Vue."},"skills_sh_url":"https://skills.sh/agentskillexchange/skills/konva-js-html5-canvas-interactive-graphics-framework"},"updatedAt":"2026-05-18T19:11:04.316Z"}}