/ Annuaire / Playground / HTML Anything
● Communauté clockless-org ⚡ Instantané

HTML Anything

par clockless-org · clockless-org/html-anything

Convert any file (logs, PDFs, transcripts, code) into a beautiful, shareable HTML page.

Drop a file — log dump, PDF, WhatsApp chat export, code, transcript — and get back a self-contained, polished HTML page across 16 design themes. Great for sharing intermediate work without paying for Notion-style hosting.

Pourquoi l'utiliser

Fonctionnalités clés

Démo en direct

Aperçu en pratique

html-anything-skill.replay ▶ prêt
0/0

Installer

Choisissez votre client

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "html-anything-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/clockless-org/html-anything",
        "~/.claude/skills/html-anything"
      ],
      "_inferred": true
    }
  }
}

Ouvrez Claude Desktop → Settings → Developer → Edit Config. Redémarrez après avoir enregistré.

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "html-anything-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/clockless-org/html-anything",
        "~/.claude/skills/html-anything"
      ],
      "_inferred": true
    }
  }
}

Cursor utilise le même schéma mcpServers que Claude Desktop. La config projet l'emporte sur la globale.

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "html-anything-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/clockless-org/html-anything",
        "~/.claude/skills/html-anything"
      ],
      "_inferred": true
    }
  }
}

Cliquez sur l'icône MCP Servers dans la barre latérale Cline, puis "Edit Configuration".

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "html-anything-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/clockless-org/html-anything",
        "~/.claude/skills/html-anything"
      ],
      "_inferred": true
    }
  }
}

Même format que Claude Desktop. Redémarrez Windsurf pour appliquer.

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "html-anything-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/clockless-org/html-anything",
        "~/.claude/skills/html-anything"
      ]
    }
  ]
}

Continue utilise un tableau d'objets serveur plutôt qu'une map.

~/.config/zed/settings.json
{
  "context_servers": {
    "html-anything-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/clockless-org/html-anything",
          "~/.claude/skills/html-anything"
        ]
      }
    }
  }
}

Ajoutez dans context_servers. Zed recharge à chaud à la sauvegarde.

claude mcp add html-anything-skill -- git clone https://github.com/clockless-org/html-anything ~/.claude/skills/html-anything

Une seule ligne. Vérifiez avec claude mcp list. Supprimez avec claude mcp remove.

Cas d'usage

Usages concrets : HTML Anything

Turn an incident log into a shareable HTML report

👤 On-call engineers writing postmortems ⏱ ~15 min intermediate

Quand l'utiliser : You have raw logs + a timeline draft and want a shareable artifact, not a wall of text.

Prérequis
  • Server/skill installed and authenticated — See repo README
Déroulement
  1. Bundle
    Use html-anything to turn /incidents/2026-05-21/*.log + timeline.md into a single HTML report. Use the 'serious' theme.✓ Copié
    → One incident.html
  2. Share
    Email the file path to me.✓ Copié
    → Self-contained HTML, no broken images when forwarded

Résultat : A polished postmortem artifact in one shot.

Pièges
  • Some 'magazine' themes embed large fonts that bloat the file. Use 'minimal' for email attachments. — Some 'magazine' themes embed large fonts that bloat the file. Use 'minimal' for email attachments.

Coût et limites

Coût d'exécution

Quota d'API
See provider docs for rate limits
Tokens par appel
Varies by tool
Monétaire
See repo README for pricing details
Astuce
Cache tool results and avoid repeated identical calls.

Sécurité

Permissions, secrets, portée

Stockage des identifiants : Use environment variables; never commit secrets
Sortie de données : Tool calls go to the provider's API as documented

Dépannage

Erreurs courantes et correctifs

HTML too large

Switch theme to 'minimal' (no embedded fonts). Inline images become base64 — strip them for size.

Vérifier : ls -lh report.html
code blocks don't highlight

Some themes default to no-highlight. Pass --code-highlight on.

Vérifier : Inspect HTML for highlight classes

Alternatives

HTML Anything vs autres

AlternativeQuand l'utiliserCompromis
zarazhangrui/frontend-slidesYou want slide decksSlides only

Plus

Ressources

📖 Lire le README officiel sur GitHub

🐙 Voir les issues ouvertes

🔍 Parcourir les 400+ serveurs MCP et Skills