Pictify Io

io.github.pictify-io由 GitHub 账号 pictify-io 发布v2.0.0更新于 Oct 24, 2026

Generate images, GIFs, videos, and PDFs from HTML, URLs, or templates — from your AI agent.

已验证Streamable HTTP可网页运行效率与工作流媒体与设计

概览

AI 生成的概览

Pictify MCP 服务器让助手从 HTML、网址或已保存模板生成图片、GIF、视频和 PDF,并管理这些模板与批量任务。

可以做什么
从 HTML/CSS、网址截图或模板生成图片,并查询图片详情与渲染历史(图片、GIF、PDF、视频)。浏览、查看、创建、更新和删除图片模板,包括变量定义与表达式校验。将模板渲染为图片或 PDF,可一次输出多种尺寸,或按最多 100 行数据批量渲染并查询状态、取消任务。列出、查看、创建、更新、复制、删除并用 AI 生成视频模板,再渲染为 MP4 或动态 GIF。
适用场景
适合让助手在对话中直接产出营销或社交图片、OG 卡片、网页截图、PDF 发票或证书、个性化批量图片,以及基于模板的短视频。
运行要求
可使用托管远程端点并通过 OAuth 登录(无需 API 密钥),或通过 npx 运行本地 npm 包,后者需要 Node.js 和 Pictify 账户的 API 密钥(PICTIFY_API_KEY)。需要访问 Pictify API 的网络连接。
安装前请注意
本地服务器需要 Pictify API 密钥(PICTIFY_API_KEY),远程端点使用 OAuth 持有者令牌。模板和视频模板可被创建、更新并永久删除,删除模板会使依赖它的批量任务或绑定失效。批量渲染会消耗套餐资源。除非设置 PICTIFY_ANALYTICS_DISABLED,否则会向 PostHog 发送使用分析,包括工具参数与结果、意图、客户端名称以及账户邮箱和套餐。

安装

在 SourceWeft 中

  1. 打开 控制台中的 Pictify Io,将其添加到工作区。
  2. 为需要使用其工具的对话启用该服务。

Web executable,通过 Streamable HTTP。 远程服务在工作区中配置后即可从网页运行时运行。

交给智能体安装

把这段提示词粘贴到 Claude Code、Codex、Cursor 等智能体,或 SourceWeft 对话中。智能体会读取该服务器的安装指南,先向你展示发布者、端点和登录方式,经你同意后再把它添加到你的客户端。密钥不会写进任何命令。

阅读 https://sourceweft.com/mcp/io.github.pictify-io%2Fmcp/install.md,并按其中说明把这个 MCP 服务器接入我的客户端。修改任何配置之前,先告诉我它的发布者、端点和登录方式,等我确认。不要把 API 密钥写进命令或我会提交的文件;问我密钥应从哪里获取。

查看智能体所依据的安装指南

其他 MCP 客户端

把它添加到你客户端的 mcpServers 配置中。

{
  "mcpServers": {
    "pictify-io": {
      "type": "http",
      "url": "https://mcp.pictify.io/"
    }
  }
}

README

@pictify/mcp-server

[npm version] [MIT License]

An MCP (Model Context Protocol) server for Pictify — generate images, GIFs, videos, and PDFs from AI agents like Claude, Cursor, and Windsurf.

One-line install. No code required. Ask your AI assistant to create OG images, social media cards, screenshots, animated GIFs, PDF invoices, certificates, and more — all from natural language.

What can it do?

  • Generate images from HTML/CSS, URLs, or reusable templates (OG images, Twitter cards, banners, product screenshots)
  • Render videos and animated GIFs from templates, including agent-authored Remotion scenes
  • Render PDFs from templates — invoices, certificates, reports, shipping labels
  • Batch generate up to 100 personalized images in one request (team badges, event passes, product catalogs)
  • Template system with 50+ expression functions for dynamic content (conditionals, string manipulation, date formatting)

Works with Claude (claude.ai + Claude Code + Claude Desktop), Cursor, Windsurf, and any MCP-compatible client.

Quick Start

Claude.ai (Web)

Use the hosted remote server — no install, no API key:

  1. Go to claude.ai > Settings > Connectors
  2. Click Add custom connector
  3. URL: https://mcp.pictify.io
  4. Click Add, then Connect — you'll log in to Pictify and approve access

Nothing goes in Advanced Settings. The connection appears under Connected apps in your Pictify settings, where you can disconnect it at any time.

Prerequisites for the local server

The npm package authenticates with an API key rather than a browser login:

  1. Sign up or log in at pictify.io
  2. Go to API Tokens
  3. Create a new token and copy it

Claude Code

bash
claude mcp add pictify -e PICTIFY_API_KEY=your_api_key -- npx -y @pictify/mcp-server

Claude Desktop

Add to your config file:

  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json
  • Linux: ~/.config/Claude/claude_desktop_config.json
json
{  "mcpServers": {    "pictify": {      "command": "npx",      "args": ["-y", "@pictify/mcp-server"],      "env": {        "PICTIFY_API_KEY": "your_api_key"      }    }  }}

Restart Claude Desktop after saving.

Cursor

Add to Cursor's MCP settings (Settings > MCP Servers):

json
{  "mcpServers": {    "pictify": {      "command": "npx",      "args": ["-y", "@pictify/mcp-server"],      "env": {        "PICTIFY_API_KEY": "your_api_key"      }    }  }}

Windsurf

Add to Windsurf's MCP settings:

json
{  "mcpServers": {    "pictify": {      "command": "npx",      "args": ["-y", "@pictify/mcp-server"],      "env": {        "PICTIFY_API_KEY": "your_api_key"      }    }  }}

Examples

Try these prompts after connecting:

Create a social media card:

"Create a Twitter card image for my blog post titled 'Getting Started with MCP' with a blue gradient background, 1200x630."

Screenshot a website:

"Take a screenshot of stripe.com at 1440x900."

Render a template:

"List my templates and render the blog-header template with title 'Hello World'."

Batch generate images:

"Use my team-badge template to generate images for these 10 team members: ..."

Create a PDF invoice:

"Render my invoice template as a PDF with company name 'Acme Inc', amount '$1,500', and date 'March 2026'."

Available Tools

Image Generation

ToolDescription
pictify_create_imageGenerate an image from HTML/CSS, a URL screenshot, or a template
pictify_get_imageGet details of a specific image by ID

Render History

ToolDescription
pictify_list_rendersList everything rendered — images, GIFs, PDFs and videos in one feed

Template Management

ToolDescription
pictify_list_templatesList saved templates with filtering and pagination
pictify_get_templateGet template details
pictify_get_template_variablesGet template variable definitions and types
pictify_render_templateRender a template with variables — images and PDFs (format: 'pdf')
pictify_multi_size_renderRender one template at several sizes in a single call
pictify_create_templateCreate a new template (HTML or FabricJS)
pictify_update_templateUpdate an existing template
pictify_delete_templateDelete a template
pictify_validate_expressionCheck a {{ }} expression parses before using it
pictify_list_expression_functionsList the functions available inside expressions

Batch Operations

ToolDescription
pictify_batch_renderStart batch render job (up to 100 items, async)
pictify_get_batch_resultsCheck batch job status and get result URLs
pictify_cancel_batchCancel a running batch job

Video

ToolDescription
pictify_list_video_templatesList your Remotion video templates
pictify_get_video_templateGet one video template in full
pictify_get_video_template_variablesDiscover the variables a video template expects
pictify_render_videoRender a video template to MP4 or GIF
pictify_create_video_templateUpload your own Remotion scene as a template
pictify_generate_video_templateGenerate a video template from a text prompt
pictify_update_video_templateUpdate a video template's name, size, duration or code
pictify_duplicate_video_templateCopy a video template
pictify_delete_video_templateDelete a video template

Configuration

VariableDescriptionDefault
PICTIFY_API_KEYYour Pictify API key (required for stdio mode)—
PICTIFY_BASE_URLCustom API base URLhttps://api.pictify.io
PICTIFY_DEBUGEnable verbose logging to stderrfalse
PICTIFY_MCP_SOURCESlug identifying where this MCP server was installed from (e.g. mcp.so, glama, smithery, claude_desktop_gallery, github). Sent as X-Pictify-MCP-Source on every API call so Pictify can attribute installs by directory.unknown
PICTIFY_ANALYTICS_DISABLEDSet to 1, true or yes to send no usage analytics at allfalse

Self-hosting the HTTP server adds MCP_PORT, MCP_PUBLIC_URL (the public origin, used to build the protected-resource metadata document) and PICTIFY_AUTH_SERVER_URL (the OAuth authorization server to point clients at, defaulting to https://api.pictify.io; PICTIFY_AUTH_SERVER is accepted too).

Usage analytics

This server reports tool usage to PostHog so we can see which tools agents reach for and which ones fail. Each call records the tool name, its arguments and result, timing, whether it errored, the stated intent, your client name and version, and — when an API key resolves to an account — your email and plan.

Arguments and results mean the HTML, URLs, prompts and template variables you pass in. If that isn't acceptable for your use, set PICTIFY_ANALYTICS_DISABLED=1 and nothing is sent.

Install attribution

When you submit @pictify/mcp-server to an MCP directory, set PICTIFY_MCP_SOURCE in the install snippet so we can attribute signups to that listing. Example for the mcp.so directory entry:

json
{  "mcpServers": {    "pictify": {      "command": "npx",      "args": ["-y", "@pictify/mcp-server"],      "env": {        "PICTIFY_API_KEY": "your_api_key",        "PICTIFY_MCP_SOURCE": "mcp.so"      }    }  }}

For the hosted remote (https://mcp.pictify.io), pass the slug as a query param on the connector URL instead — the server persists it on the OAuth session:

https://mcp.pictify.io?source=mcp.so

Accepted slugs: lowercase letters, digits, ., -, _, up to 64 characters. Anything else is dropped to unknown.

Development

bash
git clone https://github.com/pictify-io/pictify-mcp.gitcd pictify-mcpnpm installnpm run build

Test with MCP Inspector:

bash
PICTIFY_API_KEY=your_key npm run inspector

License

MIT

来源:README.md,提交 a53d4f0

工具

25

pictify_create_image

Generate a static image (PNG, JPEG, or WebP) from HTML/CSS content, a URL screenshot, or a template. Common use cases: Open Graph (OG) images for link previews, social media cards (Twitter/LinkedIn/Facebook), product screenshots, marketing banners, event invitations, and custom graphics. Provide ONE of: 'html' (custom HTML/CSS), 'url' (screenshot a webpage), or 'template' + 'variables' (render a saved template). Returns the hosted image URL (CDN-backed) and asset ID. Maximum dimensions: 4000x4000 pixels. IMPORTANT: The renderer captures the element's actual rendered size, not the viewport. If your HTML content is shorter than the requested height, the output image will be clipped to the content height. To ensure exact dimensions, set explicit width and height on your root element (e.g., a wrapper div) using CSS like: position: absolute; top: 0; left: 0; width: 1920px; height: 1080px; — this guarantees the element fills the full requested area.

输入参数urlhtmlwidthheightcontext必填selectortemplatevariablesfileExtension

pictify_get_image

Get details of a specific image by its UID. Returns the image URL, dimensions, format, and creation timestamp.

输入参数context必填imageId必填

pictify_list_renders

List what this account has rendered — images, GIFs, PDFs and videos in one feed, newest first. Filter by format, by the template that produced them, or by what called for them. Use this to find an earlier render's URL, to check whether a batch produced what was expected, or to report on recent usage. Returns each render's URL, format, dimensions, template and timestamp, plus per-format counts and a 14-day daily histogram.

输入参数limitformatoffsetsourcecontext必填template

pictify_list_templates

List saved templates in your Pictify account with pagination and filtering. Templates are reusable HTML designs with {{variableName}} placeholders for dynamic content. Use this to discover available templates before rendering. Returns template names, IDs, dimensions, output formats, and pagination info.

输入参数pagesortlimitcontext必填outputFormat

pictify_get_template

Get detailed information about a specific template by its ID. Returns the template's name, dimensions, variable definitions, tags, output format, thumbnail URL, and metadata. Use this to inspect a template before rendering.

输入参数context必填templateId必填

pictify_get_template_variables

Get the variable definitions for a template. IMPORTANT: Always call this before pictify_render_template, pictify_multi_size_render or pictify_batch_render, to discover what variables are available. Returns variable names, types (text, image, color, number, boolean), default values, and descriptions. Variables support Pictify's expression engine with 50+ functions for dynamic content (e.g., IF/ELSE conditionals, string manipulation, date formatting, math operations).

输入参数context必填templateId必填

pictify_render_template

Render a saved template with variable substitutions to produce an image or a PDF. This is also how you get a PDF out of Pictify: pass format: 'pdf'. For a multi-page PDF — one page per row of data, e.g. a run of invoices or certificates in a single file — pass variableSets instead of variables. WORKFLOW: 1) Use pictify_list_templates to find a template, 2) Use pictify_get_template_variables to discover its variables, 3) Call this tool with the variable values. Common use cases: OG images with dynamic titles, personalized social cards, product images with prices/descriptions, event banners with speaker info. For rendering the same template with many variable sets, use pictify_batch_render. Returns the hosted image URL (CDN-backed).

输入参数formatlayoutpresetcontext必填layoutsqualityvariablestemplateId必填variableSets

pictify_create_template

Create a new reusable template with variable placeholders for dynamic content generation. Templates can use either FabricJS canvas data (from the Pictify visual editor) or raw HTML. Provide ONE of 'html' or 'fabricJSData' — they are mutually exclusive. For HTML templates, use {{variableName}} syntax for dynamic placeholders. Pictify's expression engine supports 50+ functions: IF/ELSE conditionals, string manipulation (toUpperCase, truncate, etc.), date formatting, math operations, and more. After creating, use pictify_render_template to render it with specific values. Returns the created template's ID.

输入参数htmlname必填tagstypewidthheightcontext必填categoryfabricJSDataoutputFormatvariableDefinitions

pictify_update_template

Update an existing template's content, dimensions, name, or variable definitions. Only the provided fields will be updated; others remain unchanged. You can update HTML or FabricJS data — provide one or the other, not both. Note: updating content may change the available variables.

输入参数htmlnamewidthheightcontext必填templateId必填fabricJSDatavariableDefinitions

pictify_delete_template

Permanently delete a template. This action cannot be undone. WARNING: Any batch jobs or bindings using this template will stop working.

输入参数context必填templateId必填

pictify_multi_size_render

Render one template at several sizes in a single call — the same design as a 1200x630 OG card, a 1080x1080 square and a 1600x900 banner, say. Use this instead of calling pictify_render_template once per size: it is one request, one set of variables, and the results come back labelled. Different SIZES of one design; for different LAYOUT VARIANTS of it, use the 'layouts' argument on pictify_render_template instead.

输入参数sizes必填formatcontext必填qualityvariablestemplateId必填

pictify_validate_expression

Check that a template expression parses before you put it in a template. Pass the inside of the braces, not the braces: 'IF(premium, "PRO", "FREE")', not '{{...}}'. Returns whether it is valid and, if not, what is wrong with it.

输入参数context必填expression必填

pictify_list_expression_functions

List the functions available inside template expressions, with a line on what each does. Call this before writing template HTML with {{ }} logic, so the expressions use functions that exist rather than ones that look like they should.

输入参数context必填

pictify_batch_render

Render one template many times — one image per row of data. Pass EITHER variableSets (rows inline) OR csvUrl with mappings (rows from a hosted CSV). Exactly one; a call with neither is rejected. Steps: call pictify_get_template_variables first to see what the template expects, call this tool, then poll pictify_get_batch_results with the returned batchId. The job is asynchronous — this returns immediately, before any image exists. Up to 100 rows per batch, plan-dependent. For a PDF rather than images, render the template with pictify_render_template and format: 'pdf'.

输入参数csvUrlformatlayoutcontext必填layoutsqualitymappingstemplateId必填concurrencyvariableSets

pictify_get_batch_results

Check the status and results of a batch render job. Returns the job status (pending, processing, completed, failed, partial, cancelled), progress percentage, item counts, and image URLs for completed items. Each result includes index, success boolean, URL, dimensions, and error message (if failed). Call this after pictify_batch_render. If status is 'processing', call again after a few seconds to check for updates.

输入参数batchId必填context必填

pictify_cancel_batch

Cancel a running batch render job. Already completed items will retain their results and URLs. Remaining unprocessed items will be skipped. Use this if you started a batch with incorrect data or no longer need the remaining results.

输入参数batchId必填context必填

pictify_list_video_templates

List the user's video templates with their UIDs, dimensions, duration and kind. Video templates come in two kinds: 'timeline' (built in the visual studio) and 'tsx' (single-file Remotion scenes, often AI-generated). Both render the same way. WORKFLOW: call this first to find a template UID, then pictify_get_video_template_variables to see what it accepts, then pictify_render_video.

输入参数context必填

pictify_get_video_template_variables

Get a video template's variable definitions — the fields you can set when rendering it (texts, colors, image URLs). Call before pictify_render_video to know what to pass.

输入参数context必填templateId必填

pictify_render_video

Render a video template to an MP4 video or an animated GIF, with variable substitutions. Common use cases: personalized video messages, social video posts, animated certificates, product announcement clips, and GIFs for places an MP4 cannot autoplay (chat, email, READMEs). GIF output: timeline templates are palette-converted and capped at 15fps / 720px wide; code (tsx) templates encode GIF natively at half the composition frame rate with no width cap. WORKFLOW: pictify_list_video_templates → pictify_get_video_template_variables → this tool. The render takes up to a few minutes; this tool waits and returns the hosted file URL. Each render consumes one video credit.

输入参数formatcontext必填variablestemplateId必填

pictify_create_video_template

Upload a Remotion scene YOU wrote as a new video template. Use when you want full creative control over the composition — write the TSX yourself instead of delegating the design to pictify_generate_video_template. The source passes a compile gate before anything is saved: on failure you get the compiler errors back and NO template is created, so fix the code and call again. SCENE RULES (violations fail the compile gate or the render): (1) Single file. It must contain `export const schema = z.object({...})` AND `export default` a React function component typed with the schema's props. Every schema field must be flat, carry .default(...), and use .describe('...') — fields become the template's editable variables. (2) Imports ONLY from 'remotion', 'react' and 'zod'. No other packages, no relative imports. (3) ALL animation via useCurrentFrame() + useVideoConfig() with interpolate() and spring(). CSS transitions/animations and Tailwind are forbidden. Always clamp: { extrapolateLeft: 'clamp', extrapolateRight: 'clamp' }. (4) Layout with <AbsoluteFill>, inline styles, system font stacks. If you use <Sequence>, it MUST carry layout="none" and integer literals for from/durationInFrames. (5) No external assets: no fetch, no hard-coded media URLs. Media only via optional string props rendered with <Img> from 'remotion'. Use remotion's random(seed), never Math.random(). (6) Never reference require, eval, dynamic import(), fs, child_process, or the word 'process' — not even in comments or identifiers.

输入参数fpstsx必填name必填widthheightcontext必填durationSeconds

pictify_generate_video_template

Generate a new video template from a text prompt using AI. The service designs a motion brief (palette, beats, typography), writes the scene as code, compiles it, renders preview frames and visually reviews them — then saves a draft template whose text, colors and optional image are editable variables. Use when the user wants a NEW video design; to re-render an existing template with different values, use pictify_render_video instead. Takes 30-60 seconds and is metered as one render. Returns the template UID and a preview image URL; render it with pictify_render_video, or refine it in the studio.

输入参数widthheightprompt必填context必填brandColordurationSeconds

pictify_get_video_template

Get one video template in full — its kind (timeline or tsx code), dimensions, fps, duration, variable definitions and current status. Use this before updating one, to see what is there.

输入参数context必填templateId必填

pictify_update_video_template

Update a video template's name, dimensions, frame rate, duration, variable definitions, or — for code (tsx) templates only — its Remotion source. Only the fields you pass change. Timeline templates reject 'tsx': those are edited as a scene graph, not as code.

输入参数fpstsxnamewidthheightcontext必填templateId必填durationInFramesvariableDefinitions

pictify_duplicate_video_template

Copy a video template into a new one, leaving the original untouched. Use this to branch a working template before changing it. The copy counts against the saved-template limit on your plan.

输入参数context必填templateId必填

pictify_delete_video_template

Permanently delete a video template. This cannot be undone, and any automation rendering from it stops working. Renders already produced from it are unaffected.

输入参数context必填templateId必填

版本历史

2
  1. v2.0.0最新Sep 20, 2026
  2. v1.3.0Sep 16, 2026

评分

已满足适用检查项的 90%

该评分衡量此收录条目的完整程度,依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价,也不表示服务器安全或当前可用:可连通性是带日期的检查结果,评分也不包含安装量或用户评价。

  • 近 30 天内可连通必需25 分
  • 已声明认证方式必需10 分
  • 已列出工具必需15 分
  • 描述必需15 分
  • 图标10 分
  • 文档15 分
  • 许可证10 分

    请在仓库或注册中心条目中声明许可证。