An open-source Agent Skills plugin that teaches AI coding agents how to build hypermedia-driven UIs with htmx.
The skill covers hx-*
attributes, triggers, targets, swaps, out-of-band updates, extensions, security essentials, and ships the full official htmx reference docs under skills/htmx/references/
.
Marketplace (after listing): search for htmx in Cursor Marketplace or Customize → Plugins.
From GitHub now:
git clone https://github.com/piyiotisk/htmx-skills.git ~/.cursor/plugins/local/htmx-skills
Or in Cursor: Customize → Plugins → Add from GitHub → piyiotisk/htmx-skills
Community marketplace (after approval): /plugin marketplace add anthropics/claude-plugins-community
then /plugin install htmx@claude-community
From this repo now:
claude plugin marketplace add piyiotisk/htmx-skills
claude plugin install htmx@htmx-skills
Local test:
git clone https://github.com/piyiotisk/htmx-skills.git
claude --plugin-dir ./htmx-skills
From this repo:
git clone https://github.com/piyiotisk/htmx-skills.git
cp -R htmx-skills/skills/htmx ~/.agents/skills/htmx
In Codex, invoke with $htmx
or ask the agent to use the htmx skill.
After installing, invoke the skill:
/htmx:htmx
Then ask for a specific pattern:
/htmx:htmx Add debounced live search on this input — hx-get /contacts/search,
swap results into #results, show a spinner with hx-indicator.
/htmx:htmx Delete button on each table row — hx-delete, closest tr target,
and OOB-update #contact-count in the same response.
/htmx:htmx Review this template for hx-boost inheritance bugs and missing
progressive-enhancement fallbacks.
Mention the skill in chat:
- "Use the htmx skill to add inline edit on this contact card."
- "Use the htmx skill to wire delete-row + OOB count update."
- "Review this form for correct
hx-sync
and validation handling."
hx-get
,hx-post
,hx-trigger
,hx-target
,hx-swap
- Server endpoints that return HTML fragments (not JSON)
- OOB swaps, boosted navigation, SSE/WebSocket extensions
- Debugging swap, history, and attribute-inheritance issues
Full worked examples (HTML + server responses): skills/htmx/examples.md
| Path | Purpose |
|---|---|
skills/htmx/SKILL.md |
|
| Core skill instructions | |
skills/htmx/references/ |
|
| Bundled htmx docs (attributes, headers, examples, extensions) | |
skills/htmx/evals/ |
|
| Eval definitions used during skill development |
This repo also contains internal eval workspace under .cursor/skills/htmx-workspace/
(not part of the published plugin).
Validate Claude plugin manifest:
claude plugin validate .
claude plugin validate . --strict
Reference documentation under skills/htmx/references/
is derived from the htmx project documentation. Skill packaging and curation are MIT-licensed (see LICENSE).
MIT © Constantinos Pigiotis