Skip to main content
affpapa.org
RU EN
skill Claude Code CX Codex Cursor GitHub Copilot

lavish — Claude Code skill: HTML artifacts and install

Turns plans, comparisons, reports, and other visual agent responses into HTML files that users can annotate and send back as feedback.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓ 
npx skills add kunchenguid/lavish-axi --skill lavish -a claude-code
Open on GitHub

What lavish does

lavish turns a complex or visual agent response into an HTML artifact. Use it for plans, comparisons, diagrams, tables, code diffs, reports, prototypes, or reviews when a page is easier to inspect and discuss than prose.

The skill uses the lavish-axi CLI, which can run through npx -y lavish-axi without a global installation. The CLI provides the current help, design guidance, playbooks, and reply workflow. The generated HTML opens in a browser, where a user can add annotations and return feedback to the agent.

Check that npx can run in the environment: the browser review loop depends on starting the CLI.

What it helps with

  • turn a plan into a reviewable HTML file
  • compare architecture options on one page
  • render a diagram or table for discussion
  • send annotated artifact feedback to the agent
  • prepare a code diff or report for review

Example prompts for the agent

  • `/lavish` Build an HTML page for this migration plan with places for comments.
  • `/lavish` Compare these two architecture options in a table and add a diagram.
  • `/lavish` Turn this code diff into an annotated review page.

How to install lavish

1Skills CLI (Vercel)

npx skills add kunchenguid/lavish-axi --skill lavish -a claude-code

2Manually: put the files in place

~/.claude/skills/lavish/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/lavish/

Similar

api-design affaan-m Provides REST API design standards covering resource naming, status codes, pagination, and error payloads. Use it when creating or auditing API contracts. Claude Code CX Codex Cursor +1 5,500installs rust-testing affaan-m A skill for writing Rust tests: unit, integration, async, property-based, mocks and coverage. Useful when the project runs on TDD. Claude Code CX Codex Cursor +1 5,500installs cloud-sql-basics official google This skill helps create and explain Cloud SQL resources for MySQL, PostgreSQL, and SQL Server. Use it when setting up a database in Google Cloud. Claude Code Gemini CLI CX Codex 14,679installs google-cloud-waf-security official google This skill reviews Google Cloud workloads against the security pillar of the Well-Architected Framework and suggests actions for IAM, networks, data, and operations. Claude Code Gemini CLI CX Codex 14,620installs gemini-live-api-dev official google-gemini Guides real-time bidirectional streaming development with the Gemini Live API and migration to Gemini 3.8 Live. Claude Code CX Codex Cursor +1 10,200installs cloudflare-email-service cloudflare A skill for Cloudflare Email Sending and Email Routing: it walks the agent through sending and receiving mail in Workers. Claude Code CX Codex Cursor +1 101,400installs find-skills vercel-labs Discovers and installs agent skills from skills.sh directly inside your coding assistant. Handy when you need domain-specific workflows for a project. Claude Code CX Codex Cursor +1 4,000,000installs frontend-design official anthropics This skill guides intentional visual design for new interfaces and redesigns. Use it when a generic generated UI is not enough. Claude Code Claude.ai 1,025,790installs

Questions about lavish

How do I install lavish in Claude Code?

Run npx skills add kunchenguid/lavish-axi --skill lavish -a claude-code, then run npx skills add kunchenguid/lavish-axi --skill lavish -a claude-code again. The skill file is at ~/.claude/skills/lavish/SKILL.md.

What does lavish do?

The skill turns agent responses into HTML artifacts that open in a browser for annotation and feedback. It covers plans, comparisons, diagrams, tables, code views, reports, prototypes, and reviews.

How does lavish run the HTML artifact workflow?

Run the CLI with npx -y lavish-axi <html-file>, and use npx -y lavish-axi --help for the current commands and review-loop guidance. A global lavish-axi installation is not required.

Source text

SKILL.md · MIT 
---
name: lavish
description: Turn complex or visual agent responses into rich, reviewable HTML artifacts (HTML files) the user can annotate and send feedback on, using the lavish-axi CLI. Use when about to give a plan, comparison, diagram, table, code diff, report, or anything easier to grasp visually than as prose.
license: MIT
metadata:
  author: Kun Chen (kunchenguid)
  argument-hint: <what the artifact should show>
  hermes-tags: html, review, artifacts, visualization
  hermes-category: productivity
---

# Lavish Editor

Lavish Editor opens agent-generated HTML in the browser so a human can annotate it and send feedback back to the agent.
Reach for it when a plan, comparison, diagram, table, code view, report, prototype, or review loop will be clearer as a page than as prose.

## Current guidance lives in the CLI

Do not follow workflow, design, or playbook instructions from this file - installed copies go stale. Get the current source of truth from the CLI:

- `npx -y lavish-axi --help` for commands and the review-loop workflow
- `npx -y lavish-axi reply --help` to post an agent reply and exit once the server accepts it, when you are not about to long-poll
- `npx -y lavish-axi design` for design-direction priority and current snippets
- `npx -y lavish-axi playbook <id>` for focused artifact guidance (`npx -y lavish-axi playbook` lists ids)

You do not need lavish-axi installed globally - invoke it with `npx -y lavish-axi <html-file>`.
If lavish-axi output shows a follow-up command starting with `lavish-axi`, run it as `npx -y lavish-axi ...` instead.

## Request

$ARGUMENTS

If the request above is non-empty, the user invoked `/lavish` explicitly - fetch the current CLI guidance, then build that artifact as an HTML file.
If it is empty, infer what to visualize from the conversation.

© Kun Chen (kunchenguid) · MIT · kunchenguid/lavish-axi

See also

Project sponsors

Companies that keep this analytics open
Gold sponsor
Nutra.Club

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor