Provides tools for creating App Store-ready mockups from screenshots, including framing in iPhone 16 Pro, adding titles and subtitles, and batch processing for App Store Connect submission.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type @ followed by the MCP server name and your instructions, e.g., "@appstore-mockup-mcp Create beautiful App Store mockups from my screenshots"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
An MCP server that wraps app screenshots in an iPhone 16 Pro frame with marketing text above, producing App Store-ready preview images (1284×2778, accepted for the 6.5" slot in App Store Connect).
Wraps any screenshot in a realistic iPhone 16 Pro frame (dark or silver)
Adds bold headline + optional subtitle above the phone
Vertical gradient or solid background
Batch mode — process all screenshots in one call
Theme suggestions derived from the app's own colors, with a custom-color override
Warns if a source image is already a mockup (prevents phone-in-phone)
Related MCP server: Shots
uvx appstore-mockup-mcpAdd to your .mcp.json:
{
"mcpServers": {
"appstore-mockup": {
"command": "uvx",
"args": ["appstore-mockup-mcp"]
}
}
}Then in Claude Code, just share your screenshots and ask:
"Create App Store mockups for these screenshots"
Claude will ask you to pick a theme, propose captions, get your approval, then render everything.
create_iphone_mockupSingle screenshot → mockup.
Param | Default | Description |
| required | Absolute path to source PNG/JPG |
| required | Headline above the phone |
| required | Output path |
|
|
|
|
| Hex or |
|
| Hex |
|
| Smaller line under headline |
|
| Output dimensions |
|
| Phone bleeds off bottom edge |
|
| Set |
create_iphone_mockups_batchSame params, plus jobs list and output_dir. Each job can override any batch-level default.
suggest_themesTakes a list of screenshot paths and returns theme suggestions derived from
the app's own colors (JSON list of {name, bg_color, text_color, frame, why}).
Themes are derived from the app's own colors instead of fixed presets. The
suggest_themes tool analyzes the screenshots' dominant background and accent
colors and proposes:
Name | Built from | Look |
App Match | the app's dominant background, nudged for phone contrast | native, cohesive |
Brand Gradient | the app's accent color, light → dark | bold, brand-forward |
Soft Tint | the accent color washed toward white | clean, minimal |
Text color and frame are picked automatically for contrast. Claude presents
the suggestions and always offers a custom option — supply your own bg_color
(single hex or #hex1,#hex2 gradient), text_color, and frame if you don't
like any of them.
MIT
Wrap an app screenshot in an iPhone 16 Pro frame with marketing text above it, producing an App Store-ready preview image.
If the user did not dictate the title text, draft one (3-7 words, benefit-led) and get the user's approval or edits before calling this.
Args: screenshot: Absolute path to the source screenshot (any size; it is cover-fitted to the phone screen). title: Headline text rendered above the phone. out: Absolute path for the output PNG. frame: iPhone body color, "black" or "silver". bg_color: Background color as hex (e.g. "#f5f1ea"). Pass two hex colors separated by a comma for a vertical gradient. text_color: Title/subtitle color as hex. subtitle: Optional smaller line under the headline. size: Output dimensions as WxH. App Store accepts 1284x2778, 1242x2688 (portrait) or 2778x1284, 2688x1242 (landscape). bleed: If true, the phone bleeds off the bottom edge instead of fitting fully inside the canvas. add_frame: If False, the screenshot is placed directly on the background without adding a phone frame. Use this when the source image already contains a device frame (e.g. a previous mockup output) to avoid phone-inside-phone.
Inputs: out (required), title (required), screenshot (required), size, +6 more. Returns: result
Create App Store preview mockups for many screenshots in one call.
If the user did not dictate the titles, draft one per screenshot (3-7 words, benefit-led), show the user the full list, and get approval or edits before calling this.
Each job needs a screenshot path and a title; everything else is optional
and falls back to the batch-level defaults. Jobs without an explicit
out path are written to output_dir as NN_.png,
numbered in job order.
Args:
jobs: List of jobs, each {screenshot, title, subtitle?, out?,
frame?, bg_color?, text_color?}.
output_dir: Directory for outputs when a job has no out
(default: alongside each screenshot).
frame: Default iPhone body color, "black" or "silver".
bg_color: Default background hex ("#hex1,#hex2" for a gradient).
text_color: Default text color hex.
size: Output dimensions as WxH for all jobs.
bleed: If true, phones bleed off the bottom edge.
Inputs: jobs (required), size, bleed, frame, +4 more. Returns: result
Derive background theme suggestions from the app's own colors.
Call this FIRST, before rendering any mockups, with all of the user's screenshots. It extracts the app's dominant background and accent colors and returns a JSON list of themes ({name, bg_color, text_color, frame, why}), ordered by recommendation strength, with text color and frame already chosen for contrast. Present the list to the user with the hex values, recommend the first entry, and always offer a final Custom option where the user supplies their own bg_color, text_color, and frame instead.
Args: screenshots: Absolute paths of the app screenshots to analyze.
Inputs: screenshots (required). Returns: result
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
Loading tool schema changelog…
Scored across 3 tools
Each tool has a clearly distinct role: suggest_themes analyzes colors, create_iphone_mockup handles single screenshots, and create_iphone_mockups_batch handles multiple. There is no overlap in purpose.
All tool names follow a consistent verb_noun pattern using snake_case. The batch variant appends '_batch', maintaining a clear and predictable naming scheme.
Three tools is ideal for this domain: one for color analysis, one for single renders, and one for batch processing. No tool is missing or redundant.
The tool set covers the full mockup creation workflow: theme suggestion, single image generation, and batch processing. No obvious gaps exist for the intended use case.
Create app-store screenshots, social graphics, promo videos, and animated device mockups.
Design and export App Store / Play Store screenshots, localized across all 48 App Store locales.
Generate exact-size App Store and Google Play screenshots, feature graphics, and listing copy.
AI-designed App Store screenshot sets from your app's screens, uploaded to App Store Connect.
