mcpField
F
Framegrove: App Store screenshot generator

Framegrove: App Store screenshot generator

Local
framegrove.bamstudio.devMedia & Design1Updated 3w ago
RepositoryVisit website

About Framegrove: App Store screenshot generator

Framegrove is a local MCP server and CLI for app teams creating store screenshots and Apple Creative Assets from existing screenshots and captions. It offers 56 templates and renders outputs at specified dimensions.

Key features

  1. 0156 curated templates
  2. 02Render store screenshots from images and captions
  3. 03Generate Apple Creative Assets
  4. 04Inspect dimensions and PNG transparency
  5. 05Export editable project files

Use cases

  1. 01Create localized App Store screenshots
  2. 02Prepare Google Play and iPhone Duo images
  3. 03Generate Apple Creative Assets
  4. 04Check exported PNGs against output presets

MCP support

The MCP server exposes tools to browse templates and output sizes, render screenshots, build editable projects, and inspect exported assets.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
  "mcpServers": {
    "tech-bam-framegrove": {
      "command": "npx",
      "args": [
        "-y",
        "framegrove"
      ],
      "env": {
        "FRAMEGROVE_FONTS": "<FRAMEGROVE_FONTS>",
        "FRAMEGROVE_OFFLINE": "<FRAMEGROVE_OFFLINE>"
      }
    }
  }
}
Run commandnpx -y framegrove
Environment variables to set
FRAMEGROVE_FONTSOptional folder for the template font cache (default ~/.cache/framegrove/fonts).
FRAMEGROVE_OFFLINESet to 1 to skip the one-time font download.

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npmframegrove1.0.0

Tools

5

Saved tool list · updated 2w ago

This tool takes no parameters.

Details

From the project README

Framegrove

App Store, Google Play and iPhone Duo screenshot generator as an MCP server and CLI. Give it real app screenshots and captions; it renders exact-size store screenshots and Apple Creative Assets (Header, Search, Universal) from 56 curated templates. Free, MIT, runs locally.

Web editor: https://framegrove.bamstudio.dev · Source: https://github.com/tech-bam/framegrove

MCP server

Requires Node.js 20+.

Claude Code

claude mcp add framegrove -- npx -y framegrove mcp

Claude Desktop, Cursor, Windsurf, VS Code and other clients

{
  "mcpServers": {
    "framegrove": { "command": "npx", "args": ["-y", "framegrove", "mcp"] }
  }
}

Codex

codex mcp add framegrove -- npx -y framegrove mcp

Template fonts (Google Fonts, OFL) download once on the first render to ~/.cache/framegrove/fonts. Set FRAMEGROVE_FONTS to use another folder, or FRAMEGROVE_OFFLINE=1 to skip the download.

Tools
ToolWhat it does
list_templatesCurated templates with theme, orientation, default sizes and screen count
list_outputsExact dimensions for App Store, Google Play, iPhone Duo and Creative Assets
render_screenshotsRender PNGs from a template, screenshot paths and captions per language
build_projectWrite an editable .sms.json to fine-tune in the web editor
inspect_assetsCheck exported dimensions and PNG alpha against an output preset

Example prompt: "Use Framegrove to make App Store screenshots for my app from ./screens, English and German, studio-midnight template."

CLI

npx framegrove templates
npx framegrove outputs
npx framegrove render --template studio-paper --shots ./screens --lines captions.txt --out ./store
npx framegrove render --template creative-paper-header --shots ./screens --out ./header
npx framegrove inspect ./store/*.png --output iphone-6.9
npx framegrove project --template duo-paper-inner --shots ./inner --out ./editable.sms.json
npx framegrove --help

Captions file: one line per screen, Headline [highlight] | Subtitle. Add languages with --captions-de de.txt. Pick sizes with --sizes iphone-6.9,ipad-13,android-phone or WxH.

Notes

  • Apple PNG outputs are written as RGB without an alpha channel, at exact dimensions.
  • Framegrove does not capture simulator screenshots or upload to App Store Connect; it renders what you give it.
  • Preview Creative Assets in App Store Connect for device-specific cropping.

Agent skill and Claude Code plugin

The repository ships an agent skill and a Claude Code plugin that bundles the skill with this MCP server:

claude plugin marketplace add tech-bam/framegrove
claude plugin install framegrove@framegrove

MIT © Framegrove contributors

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.