HTML to Image
Render HTML and CSS to PNG images over HTTP. Send HTML and CSS and get a PNG back.
使うべきか
品質と安全性
A
検出事項（2）
- LOWTool 'generate-image-from-html' doesn't follow camelCase/snake_casegenerate-image-from-html 内
- LOWTool 'screenshot-url' doesn't follow camelCase/snake_casescreenshot-url 内
ツール定義とプロトコルへの準拠に関する自動分析に基づいています。
コンテキストコスト
~1,000トークン数（ツール定義）
~5.4 KB一般的なレスポンスサイズ
注意への影響は中程度（128k コンテキストの 0.78%）
これは、サーバーのツールがモデルのコンテキストに読み込まれるたびに消費されるおおよそのトークン数です。数が多いほど、ほかのタスクに使える注意が減ります。
インストール
ワンクリックインストール
これを `claude_desktop_config.json` ファイルに追加してください:
{
"mcpServers": {
"html-to-image": {
"url": "https://app.html2img.com/mcp"
}
}
}リモートエンドポイント
https://app.html2img.com/mcpstreamable-httpできること
ツール一覧
ツール（2）
🟢 読み取り専用🟡 書き込み🔴 削除⚪ 不明
🟡generate-image-from-html(html, css, width, height, fullpage, ...)
Render HTML and CSS into a PNG image, or into an A4 vector PDF with format "pdf". Provide complete, self-contained HTML and put styles in an inline <style> block. Remote image URLs load if they are real and publicly accessible; embed generated or local images as base64 data URIs rather than inventing URLs. Returns the rendered image plus a shareable CDN URL; PDF renders return the URL only. Consumes one credit per call.
入力スキーマ
{
"type": "object",
"properties": {
"html": {
"type": "string",
"description": "The full HTML markup to render. Include CSS in an inline <style> block. Publicly accessible remote image URLs work; use base64 data URIs for images that are not hosted anywhere."
},
"css": {
"type": "string",
"description": "Optional additional CSS to inject into the page."
},
"width": {
"type": "integer",
"description": "Viewport width in pixels (1-5000). Defaults to 1920."
},
"height": {
"type": "integer",
"description": "Viewport height in pixels (1-5000). Defaults to 1080."
},
"fullpage": {
"type": "boolean",
"description": "Capture the full scrollable page instead of just the viewport."
},
"dpi": {
"type": "integer",
"description": "Scale factor / device pixel ratio (1-4) for higher-resolution output."
},
"ms_delay": {
"type": "integer",
"description": "Milliseconds to wait before capturing (1-5000), e.g. to let fonts or animations settle."
},
"wait_for_selector": {
"type": "string",
"description": "Wait until this CSS selector is present before capturing."
},
"format": {
"type": "string",
"enum": [
"png",
"pdf"
],
"description": "Output format. \"png\" (default) returns an image sized by width and height. \"pdf\" returns an A4 portrait vector PDF with selectable, searchable text and automatic pagination; width, height, dpi and fullpage are ignored. Use \"pdf\" for documents such as invoices, reports, certificates and tickets. Use \"png\" for social cards, OG images and anything displayed at fixed pixel dimensions."
}
},
"required": [
"html"
]
}出力スキーマ
{
"type": "object",
"properties": {
"url": {
"type": "string",
"format": "uri",
"description": "Shareable CDN URL of the rendered file, at full resolution."
},
"format": {
"type": "string",
"enum": [
"png",
"pdf"
],
"description": "The output format that was rendered."
},
"credits_remaining": {
"type": "integer",
"description": "Credits left on the plan after this render."
}
},
"required": [
"url",
"format",
"credits_remaining"
]
}⚪screenshot-url(url, css, width, height, fullpage, ...)
Capture a live web page by URL as a PNG screenshot, or as an A4 vector PDF with format "pdf". Returns the rendered image plus a shareable CDN URL; PDF renders return the URL only. Consumes one credit per call.
入力スキーマ
{
"type": "object",
"properties": {
"url": {
"type": "string",
"description": "The fully-qualified URL of the page to capture (https://...)."
},
"css": {
"type": "string",
"description": "Optional CSS to inject into the page before capture."
},
"width": {
"type": "integer",
"description": "Viewport width in pixels (1-5000). Defaults to 1920."
},
"height": {
"type": "integer",
"description": "Viewport height in pixels (1-5000). Defaults to 1080."
},
"fullpage": {
"type": "boolean",
"description": "Capture the full scrollable page instead of just the viewport."
},
"selector": {
"type": "string",
"description": "Capture only the element matching this CSS selector."
},
"dpi": {
"type": "integer",
"description": "Scale factor / device pixel ratio (1-4) for higher-resolution output."
},
"ms_delay": {
"type": "integer",
"description": "Milliseconds to wait before capturing (1-5000)."
},
"wait_for_selector": {
"type": "string",
"description": "Wait until this CSS selector is present before capturing."
},
"format": {
"type": "string",
"enum": [
"png",
"pdf"
],
"description": "Output format. \"png\" (default) returns an image sized by width and height. \"pdf\" returns the page as an A4 portrait vector PDF with selectable, searchable text and automatic pagination; width, height, dpi, fullpage and selector are ignored. Use \"pdf\" to archive a page or produce a printable record. Use \"png\" for anything displayed at fixed pixel dimensions."
}
},
"required": [
"url"
]
}出力スキーマ
{
"type": "object",
"properties": {
"url": {
"type": "string",
"format": "uri",
"description": "Shareable CDN URL of the rendered file, at full resolution."
},
"format": {
"type": "string",
"enum": [
"png",
"pdf"
],
"description": "The output format that was rendered."
},
"credits_remaining": {
"type": "integer",
"description": "Credits left on the plan after this render."
}
},
"required": [
"url",
"format",
"credits_remaining"
]
}コミュニティ
エビデンス
最近の観測
検証済みバージョンは記録されていませんツール 2 件
検証済みバージョンは記録されていませんツール 2 件