{"id":"da7b97c0-eacd-4ae1-821e-b40b0672b2cc","shortId":"GEc6qA","kind":"skill","title":"GrapesJS Open Source Web Builder and Template Design Framework","tagline":"GrapesJS is a free, open-source web builder framework for creating HTML templates without coding. With 25K+ GitHub stars, it powers drag-and-drop page builders, newsletter editors, and CMS template systems with a rich plugin ecosystem.","description":"# GrapesJS Open Source Web Builder and Template Design Framework\n\nGrapesJS is a free, open-source web builder framework for creating HTML templates without coding. With 25K+ GitHub stars, it powers drag-and-drop page builders, newsletter editors, and CMS template systems with a rich plugin ecosystem.\n\n## Installation\n\nRequirements and caveats from upstream:\n- or if you're in a Node environment\n\nBasic usage or getting-started notes:\n- This is a step-by-step guide for anyone who wants to create their own builder with GrapesJS. This is not a comprehensive guide, just a concise overview of the most common modules. Follow along to create a page builder...\n- ::: tip\n- Looking for a customizable version of GrapesJS with an embeddable, production-ready UI? [Explore the Grapes Studio SDK!](https://app.grapesjs.com/docs-sdk/overview/getting-started)\n\n- Source: https://github.com/GrapesJS/grapesjs\n- Extracted from upstream docs: https://raw.githubusercontent.com/GrapesJS/grapesjs/HEAD/docs/getting-started.md\n\n## Source\n\n- [Agent Skill Exchange](https://agentskillexchange.com/skills/grapesjs-web-builder-template-framework/)","tags":["grapesjs","web","builder","template","framework","skills","agentskillexchange","agent-skills","ai-agents","ai-tools","awesome-list","claude-code"],"capabilities":["skill","source-agentskillexchange","skill-grapesjs-web-builder-template-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/grapesjs-web-builder-template-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,129 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:10:46.444Z","embedding":null,"createdAt":"2026-05-18T13:16:57.297Z","updatedAt":"2026-05-18T19:10:46.444Z","lastSeenAt":"2026-05-18T19:10:46.444Z","tsv":"'/docs-sdk/overview/getting-started)':181 '/grapesjs/grapesjs':185 '/grapesjs/grapesjs/head/docs/getting-started.md':192 '/skills/grapesjs-web-builder-template-framework/)':199 '25k':27,75 'agent':194 'agentskillexchange.com':198 'agentskillexchange.com/skills/grapesjs-web-builder-template-framework/)':197 'along':153 'anyon':127 'app.grapesjs.com':180 'app.grapesjs.com/docs-sdk/overview/getting-started)':179 'basic':111 'builder':5,18,37,53,66,85,134,158 'caveat':100 'cms':41,89 'code':25,73 'common':150 'comprehens':141 'concis':145 'creat':21,69,131,155 'customiz':163 'design':8,56 'doc':189 'drag':33,81 'drag-and-drop':32,80 'drop':35,83 'ecosystem':48,96 'editor':39,87 'embedd':169 'environ':110 'exchang':196 'explor':174 'extract':186 'follow':152 'framework':9,19,57,67 'free':13,61 'get':115 'getting-start':114 'github':28,76 'github.com':184 'github.com/grapesjs/grapesjs':183 'grape':176 'grapesj':1,10,49,58,136,166 'guid':125,142 'html':22,70 'instal':97 'look':160 'modul':151 'newslett':38,86 'node':109 'note':117 'open':2,15,50,63 'open-sourc':14,62 'overview':146 'page':36,84,157 'plugin':47,95 'power':31,79 'product':171 'production-readi':170 'raw.githubusercontent.com':191 'raw.githubusercontent.com/grapesjs/grapesjs/head/docs/getting-started.md':190 're':106 'readi':172 'requir':98 'rich':46,94 'sdk':178 'skill':195 'skill-grapesjs-web-builder-template-framework' 'sourc':3,16,51,64,182,193 'source-agentskillexchange' 'star':29,77 'start':116 'step':122,124 'step-by-step':121 'studio':177 'system':43,91 'templat':7,23,42,55,71,90 'tip':159 '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' 'ui':173 'upstream':102,188 'usag':112 'version':164 'want':129 'web':4,17,52,65 'without':24,72","prices":[{"id":"35810bd8-a5d6-4253-9fa5-6045a040de99","listingId":"da7b97c0-eacd-4ae1-821e-b40b0672b2cc","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:16:57.297Z"}],"sources":[{"listingId":"da7b97c0-eacd-4ae1-821e-b40b0672b2cc","source":"github","sourceId":"agentskillexchange/skills/grapesjs-web-builder-template-framework","sourceUrl":"https://github.com/agentskillexchange/skills/tree/main/skills/grapesjs-web-builder-template-framework","isPrimary":false,"firstSeenAt":"2026-05-18T13:16:57.297Z","lastSeenAt":"2026-05-18T19:10:46.444Z"}],"details":{"listingId":"da7b97c0-eacd-4ae1-821e-b40b0672b2cc","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"agentskillexchange","slug":"grapesjs-web-builder-template-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":"8f88a2bb1d8ddacb97ece2a059e18c83b6088f8c","skill_md_path":"skills/grapesjs-web-builder-template-framework/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/agentskillexchange/skills/tree/main/skills/grapesjs-web-builder-template-framework"},"layout":"multi","source":"github","category":"skills","frontmatter":{"name":"GrapesJS Open Source Web Builder and Template Design Framework","description":"GrapesJS is a free, open-source web builder framework for creating HTML templates without coding. With 25K+ GitHub stars, it powers drag-and-drop page builders, newsletter editors, and CMS template systems with a rich plugin ecosystem."},"skills_sh_url":"https://skills.sh/agentskillexchange/skills/grapesjs-web-builder-template-framework"},"updatedAt":"2026-05-18T19:10:46.444Z"}}