<h1 align="center"lavish-axi</h1 <p align="center" <a href="https://github.com/kunchenguid/lavish-axi/actions/workflows/ci.yml" <img alt="CI" src="https://img.shields.io/github/actions/workflow/status/kunchenguid/lavish-axi/ci.yml?style=flat-square&label=ci" /</a <a href="https://github.com/kunchenguid/lavish-axi/actions/workflows/release-please.yml" <img alt="Release" src="https://img.shields.io/github/actions/workflow/status/kunchenguid/lavish-axi/release-please.yml?style=flat-square&label=release" /</a <a href="https://www.npmjs.com/package/lavish-axi" <img alt="npm" src="https://img.shields.io/npm/v/lavish-axi?style=flat-square" /</a <a href="https://img.shields.io/badge/platform-macOS%20%7C%20Linux%20%7C%20Windows-blue?style=flat-square" <img alt="Platform" src="https://img.shields.io/badge/platform-macOS%20%7C%20Linux%20%7C%20Windows-blue?style=flat-square" /</a <a href="https://x.com/kunchenguid" <img alt="X" src="https://img.shields.io/badge/X-@kunchenguid-black?style=flat-square" /</a <a href="https://discord.gg/Wsy2NpnZDu" <img alt="Discord" src="https://img.shields.io/discord/1439901831038763092?style=flat-square&label=discord" /</a </p
<h3 align="center"For when a rich editor is not rich enough.</h3
<p align="center" <img alt="Lavish Editor demo" src="lavish-editor-marketing/renders/lavish-editor-marketing.gif" width="960" / </p
HTML is the new markdown. Lavish is the new editor for your HTML artifacts.
Agents are good at producing rich HTML artifacts, but the human-agent collaboration loop on such artifacts is lacking and falls back into screenshots and long responses for “tell me what to change.” That loses the thing HTML is best at: interactivity.
Lavish Editor opens agent-generated HTML files in a local browser, lets you pinpoint elements and selected text, edit rendered Mermaid diagrams as whiteboards, and send feedback to the agent to address.
- Local-first - Review local HTML artifacts with a local CLI and no cloud dependency in the core feedback loop; hosted sharing through third-party ht-ml.app is explicit and opt-in.
- Human-AI collaboration - Annotate elements and selected text ranges, edit Mermaid diagrams as whiteboards, and send messages to the agent without leaving Lavish Editor.
- Battery included - Lavish Editor teaches your agent good visualization for common use cases such as product or technical plans, design explorations and more out of the box.
Lavish Editor is an AXI, which means -
- It's just a CLI any capable agent can run without setup.
- It's optimized for agent ergonomics. TOON output, long polling, and contextual disclosure making it highly token efficient.
- The skill and hooks below only handle discovery; agents learn to use the AXI by using it.
Quick Start
Install the Lavish skill in the Agent Skills format with npx skills:
npx skills add kunchenguid/lavish-axi --skill lavishThat is the entire setup - no npm install needed. The skill teaches your agent to run Lavish through npx -y lavish-axi, so the CLI comes along on demand. In restricted subprocess sandboxes, CI, or agent harnesses where npx -y exits opaquely, the skill also documents direct installed-copy fallbacks through the local or global npm install path. Its frontmatter also includes Hermes Agent metadata, so Hermes-compatible harnesses can categorize and surface it as a first-class productivity skill. This installs the public lavish skill. The repository also contains an internal lavish-design brand skill for maintainers; default npx skills add ... --list and skills.sh discovery hide it unless INSTALLINTERNALSKILLS=1 is set.
Then, in agents that expose skills as slash commands (Claude Code, for example), invoke it directly:
/lavish let's discuss our plan hereOr just ask for anything that is easier to grasp visually - a plan, comparison, diagram, table, code view, or report - and the agent loads the skill on its own when it recognizes the task.
By default the skill lands in the current project's skills directory (.claude/skills/, for example); add -g to install it for all projects (~/.claude/skills/).