html-editor把任意静态 HTML 转成可视化编辑版:注入可拖动工具栏、颜色/字号/布局/风格面板、就地文字编辑、撤销保存导出干净版、元素与面板双向跳转、中英文 i18n、6 套场景风格 Prompt 一键复制给 AI 重塑样式。颜色面板数据驱动:扫 DOM 文字字符数 top 5 + 背景元素数 top 4 + 边框元素数...
Install via ClawdBot CLI:
clawdbot install ytisvibecoding/html-editorGrade Fair — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Generated Oct 2, 2026
咨询顾问完成 HTML 版市场报告后,用 html-editor 生成可编辑版,直接点击文字修正错别字、调品牌主色和章节间距,并一键复制「瑞士网格」风格 Prompt 给 ChatGPT 重塑 CSS。无需写代码即可交付多客户品牌版本的报告。
数据分析师把 HTML 仪表盘周报升级为可编辑版,业务方在浏览器里就能调整强调色、字号层级和卡片间距来适配大屏或邮件阅读。使用「导出干净版」可保留颜色变量,粘贴到 Notion 或邮件不丢色。
用户用 Claude 或 ChatGPT 生成的 HTML 落地页往往样式生硬,无法手改。加载 html-editor 后可点击任意元素调整颜色字号布局,并把「云原生企业」「Y2K 可爱数字」等场景 Prompt 复制回 AI 做风格重塑,形成生成-编辑-AI 强化的闭环。
NGO 工作人员把公益项目介绍页做成 HTML,通过 html-editor 调整「阳光手账」风格配色和文字内容,再切换中英文双显适配国内外捐赠者。全程不依赖设计师或前端开发。
教师或培训师把讲稿做成 HTML 演示稿,通过文字就地编辑、字号分组和布局滑块快速适配不同投影尺寸。学生也可自行调整可读性,并把「杂志编辑」风格提示词复制给自己常用的 AI 做个性化改写。
html-editor 以 MIT 或类似开源协议免费发布核心 adapt.py 与编辑器运行时,吸引开发者和个人用户。企业版提供团队共享风格库、审计日志、批量 adapt CLI 与钉钉/Slack 集成,按月或按席位订阅。
基础版靠启发式命名和本地风格 Prompt 免费可用;高级版接入托管 LLM 端点,自动生成语义化 CSS 变量命名、品牌一致性检查以及针对具体页面的定制重写 Prompt,按 token 或包月计费。
围绕 6 套内置场景风格扩展出创作者生态,设计师和开发者上架更多行业风格 Prompt、配色包与预设面板,平台对每次下载或商用授权抽取佣金,并通过首页推荐位做付费曝光。
💬 Integration Tip
通过 pip install beautifulsoup4 后直接运行 python scripts/adapt.py <html> 即可生成可编辑版,无需配置 API key(LLM 命名会启发式兜底);建议先把 skill 目录放到 ~/.claude/skills/ 或 ~/.workbuddy/skills/ 下以便 Agent 自动发现脚本。
Scored Oct 2, 2026
Use when building UI with shadcn/ui components, Tailwind CSS layouts, form patterns with react-hook-form and zod, theming, dark mode, sidebar layouts, mobile navigation, or any shadcn component question.
Tailwind reference tool. Use when working with tailwind in frontend contexts.
A product creation skill based on the "Bee Website Builder" Open API. It is used to create a new product under a specified site language and product group, w...
A product update skill based on the "Bee Website Builder" Open API. It is used to update an existing product under a specified site language and supports upd...
Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions. Use when implementing accessible interfaces, fixing screen reader issues, keyboard navigation, or troubleshooting "focus outline missing", "aria-label required", "insufficient contrast".
Use when building Vue 3 applications with Composition API, Nuxt 3, or Quasar. Invoke for Pinia, TypeScript, PWA, Capacitor mobile apps, Vite configuration.