artifact

artifact is a skill for Claude Code, Codex from xiagaohui/local-artifacts-for-claude-code. It costs 62 tokens per session (457 once invoked), scanned C, original, MIT.

A local web page for viewing the latest published artifact, such as a generated result or document. It is an unofficial local copy of the artifact-viewing experience and runs at localhost:7891 by default.

In plain words
What is it for?
Use it to open the latest artifact, check whether the local viewer is running, and view updates when a new artifact is published.
Why use it?
It gives you a quick browser view of the most recently published result without needing a cloud service.

Skill for Claude CodeCodex

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/xiagaohui/local-artifacts-for-claude-code/skill
Any agent
npx skills add xiagaohui/local-artifacts-for-claude-code --skill skill
Clone the repo
git clone --depth 1 https://github.com/xiagaohui/local-artifacts-for-claude-code

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for artifact

README.md
[![agentmods](https://agentmods.dev/badge/skills/xiagaohui/local-artifacts-for-claude-code/skill.svg)](https://agentmods.dev/skills/xiagaohui/local-artifacts-for-claude-code/skill)
Your own site
<a href="https://agentmods.dev/skills/xiagaohui/local-artifacts-for-claude-code/skill"><img src="https://agentmods.dev/badge/skills/xiagaohui/local-artifacts-for-claude-code/skill.svg" alt="Measured on agentmods" height="20"></a>
Per session 62 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 457 The whole file, excluding the scripts and references it only reads on demand.
Security scan C 2 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00062 $0.00457
Opus 5 $0.00031 $0.00229
Sonnet 5 $0.00012 $0.00091
Haiku 4.5 $0.00006 $0.00046

Measured 4d ago against content hash faa491a916c0, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade C, and why

artifact scanned grade C with 2 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 4d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Downloads and executes remote codehighSupply chain

curl | sh runs whatever the server returns today, which is not necessarily what it returned when this was reviewed.

curl -s "http://localhost:${PORT}/status" 2>/dev/null | python3 -c "

Makes network callslowCapability

Not a fault in itself. Listed so you know the mod talks to something, and to what.

curl -s "http://localhost:${PORT}/status" 2>/dev/null | python3 -c "
skill/SKILL.md · 50 lines

What it actually says

Local Artifact Viewer (unofficial local look-alike)

Open the most recently published artifact in the browser.

This is the local, unofficial look-alike of Claude Code Artifacts. It mimics the official UX but runs a small local HTTP server instead of the cloud, no-backend design used by the official feature.

Open the latest artifact

open "http://localhost:${ARTIFACTS_PORT:-7891}" 2>/dev/null \
  || xdg-open "http://localhost:${ARTIFACTS_PORT:-7891}" 2>/dev/null \
  || python3 -c "import webbrowser,os;webbrowser.open('http://localhost:'+os.environ.get('ARTIFACTS_PORT','7891'))"

If the page is empty, nothing has been published yet. Tell Claude:

把这个结果做成 artifact 发布     (or: "make this into an artifact")

Claude will call the publish_artifact MCP tool, which opens the browser and updates the page in place on every publish.

Check service status

PORT="${ARTIFACTS_PORT:-7891}"
curl -s "http://localhost:${PORT}/status" 2>/dev/null | python3 -c "
import json,sys
try:
    d = json.load(sys.stdin)
    print('✅ service running')
    if d.get('title'):
        print(f'   latest: {d.get(\"emoji\",\"\")} {d[\"title\"]} @ {d.get(\"published_at\",\"\")}')
    else:
        print('   no artifact published yet')
    if d.get('http_error'):
        print('   ⚠️ ', d['http_error'])
except Exception:
    print('❌ service not reachable — restart Claude Code so the MCP server starts')
"
Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 4d ago First seen · 50 lines · 62 tokens per session scan C faa491a916c0

Subscribe to this mod's changes

artifact is a skill published in the GitHub repository xiagaohui/local-artifacts-for-claude-code (0 stars, last pushed 2mo ago), licensed MIT. It adds 62 tokens to every session and 457 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it C with 2 findings (downloads and executes remote code, makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.

Related

Other skills, from other repositories

chrome-devtools-cli

Use this skill to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via CLI.

ChromeDevTools/chrome-devtools-mcp · 31 tokens

a11y-debugging

Uses Chrome DevTools MCP for accessibility (a11y) debugging and auditing based on web.dev guidelines. Use when testing semantic HTML, ARIA labels, focus states, keyboard navigation, tap targets, and color contrast.

ChromeDevTools/chrome-devtools-mcp · 50 tokens

chrome-devtools

Uses Chrome DevTools via MCP for efficient debugging, troubleshooting and browser automation. Use when debugging web pages, automating browser interactions, analyzing performance, or inspecting network requests. This skill does not apply to --slim mode (MCP configuration).

ChromeDevTools/chrome-devtools-mcp · 55 tokens

debug-optimize-lcp

Guides debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools. Use this skill whenever the user asks about LCP performance, slow page loads, Core Web Vitals optimization, or wants to understand why their page's main content takes too long to appear. Also use when the user mentions…

ChromeDevTools/chrome-devtools-mcp · 99 tokens

2-repro-issue

Reproduce a single LinkedIn-MCP issue locally on the current branch against the real authenticated LinkedIn session at /.linkedin-mcp/profile/, using the MCP streamable-http server. Captures the exact failure mode (tool output, error, missing data) and maps it back to the scraper code path. Use when the user says…

stickerdaniel/linkedin-mcp-server · 75 tokens

memory-leak-debugging

Diagnoses and resolves memory leaks in JavaScript/Node.js applications. Use when a user reports high memory usage, OOM errors, or wants to capture, compare, or inspect heap snapshots with Chrome DevTools MCP memory tools.

ChromeDevTools/chrome-devtools-mcp · 52 tokens