skills.rest
camel-vibe
camel-vibeOFFICIAL
Explore all skills by this author →
GitHub

artifact-builder

Generate and deliver interactive HTML artifacts as Telegram Mini Apps.

33|4|Updated May 29, 2026
Search Tags:#html#interactive#visualization#artifacts#telegram#bot api#mini app
One-click install
npx skills add https://github.com/camel-vibe/hermes-telegram-artifacts --skill artifact-builder-camel-vibe
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: artifact-builder
Source: https://github.com/camel-vibe/hermes-telegram-artifacts
Command: npx skills add https://github.com/camel-vibe/hermes-telegram-artifacts --skill artifact-builder-camel-vibe

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python-telegram-bot, python-dotenv, requests, and includes scripts (resource) and references (resource) components.

What problem does it solve? Telegram cannot render interactive HTML inline in chat, so rich content like charts, recipes, calculators, and checklists gets flattened into plain text. This Skill builds self-contained HTML artifacts, serves them over HTTP, and delivers them as Telegram Mini App buttons that open as full interactive panels. ## Core Features & Use Cases - Artifact generation and delivery: Write HTML, register it with the bundled stdlib-only artifact server (port 9877), and send a web_app button via the Telegram Bot API using send-artifact.py. - Ready-made templates: Generate shopping lists with localStorage persistence, recipes with portion scalers and timers, sortable/searchable CSV viewers, and markdown viewers from structured data or files. - Telegram theme integration: Artifacts use --tg-theme-* CSS variables so they automatically adapt to every Telegram theme, with gallery browsing at /artifacts/all. - Use Case: A user asks for a weekly meal plan with a grocery list. The agent generates a recipe artifact with a portion calculator and a persistent shopping-list checklist, then delivers both as tappable Mini App buttons in the chat. ## Quick Start Build an interactive HTML artifact for my recipe and send it to my Telegram chat using the send-artifact script with my configured host.

Frequently Asked Questions about artifact-builder

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I send an interactive HTML page to a Telegram chat?▼

Write the HTML to a file, then run send-artifact.py with the file path, button title, public host, and optional chat_id and thread_id. The script registers the artifact with the local server and sends a web_app button that opens it as a Mini App.

How do Telegram Mini Apps work for displaying HTML content?▼

Telegram Mini Apps are full web pages opened from a web_app button in chat. The bot sends a button whose URL points to your hosted HTML, and Telegram renders it in a sliding WebView panel with access to the Telegram.WebApp JavaScript API.

Does Telegram Mini App require HTTPS?▼

Yes, Telegram requires HTTPS for Mini App URLs except localhost testing. Put the artifact server behind a reverse proxy such as nginx, caddy, or Tailscale Funnel to provide a valid TLS endpoint.

Why is my Telegram web_app button not opening the artifact?▼

Check that the artifact server returns 200 on both localhost:9877 and your public HTTPS URL, and that Mini Apps are enabled via @BotFather. The button must use web_app type with a WebAppInfo URL, not a plain url button.

Can Telegram Mini Apps persist data between sessions?▼

Yes, localStorage works inside the Mini App WebView and survives closing Telegram, though iOS may expire it after about 7 days of disuse. For critical preferences use tg.CloudStorage, which syncs across devices.

What are the limitations of Telegram Mini App artifacts?▼

Telegram cannot render HTML inline in chat, so the web_app button is the only delivery path. Keep HTML under 100KB, avoid inline large assets, and note that localStorage is device-local so state does not sync between phone and desktop.

Related Skills

Explore More Software Engineering Skills→
simplefarmer69simplefarmer69
2

telegram-bot-manager

Manage Telegram bot registration, token validation, and connectivity checks for OpenClaw.

Community
Intermediate
samuelbonifacio015samuelbonifacio015

llamia-social-circle-validation

Validate the LlamIA platform by engaging real users and iterating on prompts.

Community
Advanced
XWIlluDeluXWIlluDelu

theme-factory

Apply curated font and color themes to slides, documents, and HTML styling.

Community
Basic
AndVl1AndVl1
4

telegram-mini-apps

Build Telegram Mini Apps with frontend toolkits and initData authentication flows.

Community
Intermediate