AI-First CLI for App Store Screenshots - Generate beautiful, localized screenshots with device frames, gradients, and captions.
π https://appshot.sh
π Version 2.0.0 - Layout v2 + Agent-First Architecture
- MCP Server: Full Model Context Protocol support for AI agents (Claude Desktop, Claude Code, etc.)
- 20 MCP Tools: Complete coverage - init, build, wizard, quickstart, template, captions, gradients, backgrounds, fonts, config, validate, specs, doctor, presets, localize, languages, frame, export, clean, projectInfo
- Claude Code Skill: Install with
appshot skill- includes templates, troubleshooting guides - Auto-Caption: Generate captions from filenames with
--auto-captionor MCPaction: "auto" - Direct Tool Access: Agents can manage entire screenshot workflows without shell access
- Why Appshot?
- Features
- Quick Start
- MCP Server & Agent Integration
- Core Concepts
- Visual Customization
- Localization & Translation
- Device Support
- Fastlane Integration
- Command Reference
- Configuration Reference
- Agent & Automation Guide
- Recipes & Examples
- Troubleshooting
- Development
- Roadmap
- License & Support
Appshot is the only agent-first CLI tool designed for automated App Store screenshot generation. Built for LLM agents, CI/CD pipelines, and developers who value automation over GUIs.
NEW in v2.0.0: Fixed layout zones and v2 templates for clean, predictable screenshots out of the box.
- π€ Agent-First Design - JSON outputs, predictable commands, no interactive prompts in automation mode
- π― Smart Automation - Auto-detects orientation, selects appropriate frames, handles batch operations
- π AI-Powered Localization - Translate captions in real-time using GPT-4o, GPT-5, o1, and o3 models
- π App Store Compliant - Built-in validation for all official Apple App Store specifications
- β‘ Fast & Parallel - Process hundreds of screenshots with configurable concurrency
- π οΈ Pure CLI - No web UI, no GUI, just predictable commands perfect for automation
These are generated by the v2 templates included in template-samples/iphone/:
| Ocean Header | Sunset Footer | Clean Screenshot |
|---|---|---|
![]() |
![]() |
![]() |
| Pastel Header | Noir Footer | Silver Header |
![]() |
![]() |
![]() |
| Slate Footer | Midnight Header | Tropical Header |
![]() |
![]() |
![]() |
For the full template gallery, open
template-samples/index.html.
- πΌοΈ Smart Frames - Automatically detects portrait/landscape and selects appropriate device frame
- π¨ Gradient Presets - 24+ beautiful gradients with visual preview and easy application
- π€ Font System - 50+ font mappings, direct font setting, interactive selection, and system detection
- π¦ Embedded Fonts - 10 high-quality open source fonts bundled for consistent rendering everywhere
- βοΈ Dynamic Captions - Smart text wrapping, auto-sizing, and multi-line support
- π AI Translation - Real-time and batch translation using OpenAI's latest models
- π± Multi-Device - iPhone, iPad, Mac, Apple TV, Vision Pro, and Apple Watch support
- π Frame-Only Mode - Quick device framing with transparent backgrounds (no gradients/captions)
- π App Store Specs - All official resolutions with validation and presets
- π Orientation Detection - Intelligently handles both portrait and landscape
- ποΈ Watch Mode - File system monitoring with auto-processing (macOS)
- π± Device Capture - Direct capture from iOS simulators (macOS)
- β‘ Parallel Processing - Configurable concurrency for large batches
- π Caption Autocomplete - Intelligent suggestions with fuzzy search and learning
- π¬ Dry-Run Mode - Preview what would be built without generating images
- π Verbose Debugging - Detailed rendering metrics for troubleshooting
- Node.js 18+ - Required for ESM modules
- npm or yarn - Package manager
- Operating System - macOS, Linux, or Windows
- Optional: OpenAI API key for translation features
# Install globally via npm
npm install -g appshot-cli
# Or with yarn
yarn global add appshot-cli
# Verify installation
appshot --versionNote: The package is called
appshot-clion NPM, but the command isappshot
The wizard is the fastest way to get v2 screenshots, because it:
- Applies a template (optional) for layout + background + caption styling
- Auto-detects orientation from your screenshots and sets
resolution - Generates captions (from filenames or manual entry)
- Localizes + enhances (optional)
- Builds in one pass
# Interactive wizard (templates included)
appshot wizard
# Non-interactive (CI)
appshot wizard --no-interactive --devices iphone,ipad --template ocean-header --caption-source filenames --langs en,es,frTip: If no screenshots exist yet, the wizard keeps
resolutionunset so build uses the real screenshot dimensions later.
The fastest way to get professional screenshots:
# One command interactive setup
appshot quickstart
# One-shot v2 flow (layout β captions β build)
appshot wizard
# Or apply a specific template
appshot template ocean-header --caption "Your Amazing App"
# Build your screenshots
appshot build
# β¨ Professional screenshots ready in seconds!Full control over every aspect:
# 1. Initialize your project
appshot init
# 2. Add your screenshots
cp ~/Desktop/screenshots/*.png screenshots/iphone/
# 3. Add captions interactively
appshot caption --device iphone
# 4. Apply a gradient preset
appshot gradients --apply ocean
# 5. Build final screenshots
appshot build
# β¨ Output ready in final/ directory!Need just device frames without the full treatment? Use the new frame command:
# Frame a single screenshot
appshot frame screenshot.png
# Batch frame a directory
appshot frame ./screenshots --recursive
# β¨ Framed PNGs with transparent backgrounds ready!Automatically process screenshots as they're added:
# Start watching for new screenshots
appshot watch start --process --background
# Capture from simulator (auto-processes via watch)
appshot device capture
# Check status
appshot watch status
# Stop watching
appshot watch stopfinal/
βββ iphone/
β βββ en/ # Language subdirectory (always created)
β βββ home.png # 1284Γ2778 with frame, gradient, and caption
β βββ features.png
β βββ settings.png
βββ ipad/
βββ en/ # Language subdirectory
βββ dashboard.png # 2048Γ2732 iPad Pro screenshot
When you want a clean slate without deleting screenshots:
# Remove outputs + .appshot/ but keep screenshots/
appshot clean --reset --yes
# Remove outputs + .appshot/ + temp files
appshot clean --all --yes
# Clear caption history only
appshot clean --history--reset is safe for projects: it keeps screenshots/ intact and wipes generated files.
Appshot provides a full Model Context Protocol (MCP) server, enabling AI agents like Claude Desktop and Claude Code to manage screenshot workflows directly through tool calls.
Claude Code (recommended):
# Add the MCP server
claude mcp add appshot-mcp appshot mcp
# Verify it's connected
claude mcp listClaude Desktop (macOS):
Edit ~/Library/Application Support/Claude/claude_desktop_config.json:
{
"mcpServers": {
"appshot": {
"command": "appshot",
"args": ["mcp"]
}
}
}Tip: When using Claude Desktop, provide the full
configPathparameter to your project directory since the server runs from the home directory.
| Tool | Description |
|---|---|
appshot_projectInfo |
Get project metadata (devices, languages, config) |
appshot_init |
Initialize new project structure |
appshot_quickstart |
Quick start setup with templates + captions |
appshot_wizard |
One-shot v2 flow (template/layout β captions β translate/enhance β build) |
appshot_build |
Generate final screenshots |
appshot_frame |
Apply device frames only (transparent background) |
appshot_template |
Apply v2 template presets |
appshot_captions |
Read/write caption text, auto-generate from filenames |
appshot_gradients |
List/apply gradient presets |
appshot_backgrounds |
Configure background images |
appshot_fonts |
List/validate available fonts |
appshot_config |
Modify device-specific settings |
appshot_validate |
Check App Store compliance |
appshot_specs |
View App Store specifications |
appshot_doctor |
Run system diagnostics |
appshot_presets |
Manage App Store presets |
appshot_localize |
AI-powered caption translation |
appshot_languages |
Discover available translations |
appshot_export |
Export for Fastlane |
appshot_clean |
Remove generated files |
Agent: I'll set up your App Store screenshots.
1. appshot_init with force: true
2. appshot_gradients with action: "apply", preset: "ocean"
3. appshot_captions with device: "iphone", action: "set",
filename: "home.png", caption: "Welcome Home"
4. appshot_build with devices: ["iphone"]
5. appshot_validate
β Screenshots ready in final/iphone/en/
Auto-Caption Workflow (generate captions from filenames):
1. appshot_init with force: true
2. appshot_template with template: "ocean-header"
3. appshot_captions with device: "iphone", action: "auto"
4. appshot_build with devices: ["iphone"]
β Captions auto-generated: "home-screen.png" β "Home Screen"
Wizard Workflow (single tool call):
appshot_wizard with {
devices: ["iphone", "ipad"],
template: "ocean-header",
captionSource: "filenames",
languages: ["en", "es", "fr"],
noInteractive: true
}
For Claude Code users, install the appshot skill for guided workflows:
# Install skill to ~/.claude/skills/appshot/
appshot skill
# Update existing installation
appshot skill --force
# Uninstall
appshot skill --uninstallThe skill provides:
- Project workflow guidance (init β captions β styling β build)
- Template recommendations by app type (dev tools β midnight-header, business β slate-footer)
- Troubleshooting guide for common errors
- Reference files for all 24 gradients, 10 fonts, and 9 templates
- Structured Output: All tools return JSON for easy parsing
- No Interactive Prompts: Full automation without user input
- Predictable Commands: Consistent tool interfaces
- Complete Coverage: Every CLI feature available as MCP tool
Claude Desktop is fully supported as of v2.0.0. Add appshot to your Claude Desktop configuration:
macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
{
"mcpServers": {
"appshot": {
"command": "appshot",
"args": ["mcp"]
}
}
}Restart Claude Desktop after adding the configuration. All MCP tools will be available.
Tip: When using Claude Desktop, always provide the full
configPathparameter pointing to your project directory, since Claude Desktop runs from the home directory.
π§ Layout v2 - Fixed Zones + Three Layout Modes
- Modes: header, footer, screenshot-only (overlay removed)
- Fixed Regions: Caption/device ratios are deterministic per device type
- Device-Based Font Scaling: Text size scales by output resolution (iPad/Mac larger, Watch smaller)
- Config v2:
version: 2configs only allow styling, not layout proportions - Docs: See
docs/layout-v2.mdfor full rules
Appshot creates and manages the following directory structure in your project:
your-project/
βββ .appshot/
β βββ config.json # Main configuration
β βββ captions/ # Device-specific captions
β β βββ iphone.json
β β βββ ipad.json
β β βββ mac.json
β β βββ watch.json
β βββ caption-history.json # Autocomplete history (created on use)
β βββ ai-config.json # AI translation settings (optional)
β βββ processed/ # Watch mode tracking (macOS only)
β βββ watch.pid # Watch service PID (macOS only)
βββ screenshots/ # Your original screenshots
β βββ iphone/
β β βββ background.png # Optional device background
β βββ ipad/
β βββ mac/
β βββ watch/
βββ final/ # Generated output
βββ iphone/
β βββ en/ # Language subdirectory (always created)
β βββ es/ # Additional languages as needed
β βββ fr/
βββ ipad/
βββ en/
Created by appshot init:
.appshot/directory with config.json.appshot/captions/with device JSON filesscreenshots/directories for each device type
Created during usage:
final/- Created when you runappshot build.appshot/caption-history.json- Created when using captions.appshot/processed/- Created by watch mode (macOS)
All settings are stored in .appshot/config.json:
{
"version": 2,
"layout": "header",
"caption": {
"font": "SF Pro Display Bold",
"color": "#FFFFFF"
},
"background": {
"mode": "gradient",
"gradient": {
"colors": ["#0077BE", "#33CCCC"],
"direction": "diagonal"
}
},
"devices": {
"iphone": {
"input": "./screenshots/iphone",
"resolution": "1290x2796"
}
},
"output": "./final",
"frames": "./frames"
}- Capture - Take screenshots from simulator/device or design tool
- Configure - Set up gradients, fonts, and device settings
- Caption - Add marketing text with optional AI translation
- Build - Generate final App Store-ready screenshots
- Validate - Ensure compliance with App Store requirements
Appshot v2 templates map to fixed layout modes (header/footer/screenshot-only) plus curated gradients and caption styling defaults. Layout proportions are deterministic per device and not user-adjustable in v2. Overlay mode is removed. See docs/layout-v2.md for the full rules.
# Interactive template selection
appshot quickstart
# Apply a specific template
appshot template ocean-header
# Apply template with caption
appshot template pastel-header --caption "Beautiful & Simple"
# Preview template settings
appshot template --preview noir-footer
# List all templates
appshot template --list| Template | Description | Best For |
|---|---|---|
| ocean-header | Cool blue gradient + header layout | General purpose |
| sunset-footer | Warm sunset gradient + footer layout | Bold marketing |
| clean-screenshot | Minimal background + screenshot-only | Product-focused |
| pastel-header | Soft pastel gradient + header layout | Clean, friendly apps |
| noir-footer | Dark dramatic gradient + footer layout | Entertainment, gaming |
| silver-header | Elegant silver gradient + header layout | Professional apps |
| tropical-header | Bright tropical gradient + header layout | Playful brands |
| slate-footer | Professional slate gradient + footer layout | Business, productivity |
| midnight-header | Deep blue gradient + header layout | Developer tools |
πΈ Template Gallery (v2): Open template-samples/index.html to browse the current v2 template gallery.
Each template automatically configures:
- Layout Mode: header, footer, or screenshot-only
- Background: Gradient colors and direction
- Caption Style: Font family, color, background, and opacity
- Device Strategies: Fixed ratios, scaling, and line limits per device type
# Ocean Header - General purpose
appshot template ocean-header
# β Header layout + cool blue gradient
# β Fixed zones, centered caption
# Clean Screenshot - Product-forward
appshot template clean-screenshot
# β Screenshot-only layout
# β Minimal background styling
# Noir Footer - Bold marketing
appshot template noir-footer
# β Footer layout + dark gradient
# β High-contrast caption stylingTemplates provide a starting point that you can further customize:
# 1. Apply a template
appshot template ocean-header
# 2. Adjust styling (layout proportions are fixed in v2)
appshot style # Pick layout + gradient + caption color
appshot fonts --set "Poppins Bold" # Change font
appshot caption --device iphone # Update captions
# 3. Build with your customizations
appshot buildTemplates ensure consistency across all your screenshots:
// After applying a template, all devices share:
{
"background": { /* Same gradient/image */ },
"caption": { /* Same font and styling */ },
"devices": {
"iphone": { /* Optimized for iPhone */ },
"ipad": { /* Optimized for iPad */ },
"watch": { /* Special watch handling */ }
}
}Appshot includes 24+ professional gradient presets organized by category:
# View all gradients with color preview
appshot gradients
# Apply a gradient to your project
appshot gradients --apply sunset
# Interactive selection
appshot gradients select
# Generate preview image
appshot gradients --preview ocean
# Create sample gallery
appshot gradients --sample- π₯ Warm: sunset, autumn, golden, coral
- βοΈ Cool: ocean, arctic, mint, twilight
- π¨ Vibrant: neon, tropical, rainbow, vivid
- ποΈ Subtle: pastel, lavender, peach, sky
- β«βͺ Monochrome: noir, silver, charcoal, pearl
- π’ Brand: instagram, spotify, twitter, slack
{
"gradient": {
"colors": ["#FF5733", "#FFC300", "#FF1493"],
"direction": "diagonal" // top-bottom, left-right, diagonal
}
}Replace gradients with custom static background images for a unique, branded look. Appshot supports automatic detection, multiple formats, and intelligent scaling.
Backgrounds are searched in priority order:
- Device-specific:
screenshots/<device>/background.png - Global:
screenshots/background.png - Custom: Path specified via config or CLI
# Set background for a device
appshot backgrounds set iphone ./backgrounds/sunset.jpg
# Set global background for all devices
appshot backgrounds set --global ./backgrounds/brand-bg.png
# Validate dimensions against App Store specs
appshot backgrounds validate
# List all configured backgrounds
appshot backgrounds list
# Clear background configuration
appshot backgrounds clear iphone# Auto-detect background.png in device folders
appshot build --auto-background
# Use specific background image
appshot build --background ./assets/custom-bg.png
# Set background fit mode
appshot build --background-fit cover
# Disable backgrounds (transparent)
appshot build --no-backgroundcover- Scale to cover entire area (may crop)contain- Scale to fit within area (may add letterbox bars)fill- Stretch to exact dimensions (may distort)scale-down- Only scale down if larger, never scale up
ImageMagick is a powerful CLI tool for creating custom backgrounds:
# Solid color background
magick -size 1290x2796 canvas:navy background.png
# Gradient background
magick -size 1290x2796 gradient:blue-purple background.png
# Radial gradient
magick -size 1290x2796 radial-gradient:white-darkblue background.png
# Plasma fractal pattern
magick -size 1290x2796 plasma:fractal background.png
# Blurred noise texture
magick -size 1290x2796 xc: +noise Random -blur 0x10 background.png
# Tiled pattern
magick -size 100x100 pattern:checkerboard -scale 1290x2796 background.png
# Multi-point color interpolation
magick -size 1290x2796 xc: -sparse-color barycentric \
'0,0 skyblue 1290,0 white 645,2796 lightblue' background.png{
"background": {
"mode": "image",
"image": "./backgrounds/global.png",
"fit": "cover"
},
"devices": {
"iphone": {
"background": {
"image": "./backgrounds/iphone.png",
"fit": "contain"
}
}
}
}You can mix backgrounds and gradients across devices:
- iPhone uses a custom background image
- iPad falls back to gradient
- Mac uses a different background
- Watch uses the global background
This flexibility allows you to optimize each device's appearance independently.
Appshot validates background dimensions and warns about:
- Images smaller than target resolution (will be upscaled)
- Aspect ratio mismatches (may cause cropping/distortion)
- Large file sizes (>10MB triggers optimization suggestion)
Use appshot backgrounds validate to check all backgrounds before building.
Version 0.4.0 introduces comprehensive font management with intelligent fallbacks.
# Browse recommended fonts
appshot fonts
# Set font directly (NEW in v0.4.0)
appshot fonts --set "Montserrat"
# Interactive font selection (NEW in v0.4.0)
appshot fonts --select
# Set device-specific font (NEW in v0.4.0)
appshot fonts --set "SF Pro" --device iphone
# List ALL system fonts
appshot fonts --all
# Validate a font
appshot fonts --validate "SF Pro"
# Get JSON output for automation
appshot fonts --jsonYou have three ways to set fonts:
-
Direct Command (Fastest):
appshot fonts --set "Helvetica" appshot fonts --set "SF Pro" --device iphone
-
Interactive Selection:
appshot fonts --select appshot style --device iphone # Also includes font selection -
Manual Configuration:
{ "caption": { "font": "Montserrat", // Global default "fontsize": 64 }, "devices": { "iphone": { "captionFont": "SF Pro" // Device override } } }
Every font automatically includes appropriate fallback chains:
- SF Pro β
system-ui, -apple-system, Helvetica, Arial, sans-serif - Custom Serif β
'Custom Serif', Georgia, Times New Roman, serif - Code Font β
'Code Font', Monaco, Consolas, monospace
- macOS: Uses
system_profilerfor complete font list - Linux: Uses
fc-listfor fontconfig fonts - Windows: PowerShell queries font registry
New in v0.8.0, the appshot frame command provides a quick way to apply device frames to screenshots without adding gradients or captions. Perfect for design workflows, quick exports, and when you just need a framed device mockup.
- Auto Device Detection - Intelligently detects iPhone, iPad, Mac, or Apple Watch from image dimensions
- Transparent Backgrounds - Outputs PNG with alpha channel preserved
- Batch Processing - Frame entire directories with recursive support
- Smart Frame Selection - Automatically chooses portrait/landscape frames
- No Configuration Required - Works instantly without setup
# Frame a single screenshot
appshot frame screenshot.png
# Frame all images in a directory
appshot frame ./screenshots
# Recursive directory processing
appshot frame ./screenshots --recursive
# Output to specific directory
appshot frame screenshot.png -o ./framed
# Force device type
appshot frame screenshot.png --device iphone-o, --output <dir>- Output directory (default: same as input)-d, --device <type>- Force device type (iphone|ipad|mac|watch)-r, --recursive- Process directories recursively-f, --format <type>- Output format: png (default) or jpeg--suffix <text>- Filename suffix (default: "-framed")--overwrite- Overwrite original file name--dry-run- Preview without processing--verbose- Show detailed information
# Batch frame iPhone screenshots
appshot frame ./iphone-screenshots
# Frame with custom output directory
appshot frame ./screenshots -o ./mockups --recursive
# Preview what would be framed
appshot frame ./screenshots --dry-run
# Force iPad frame for ambiguous dimensions
appshot frame screenshot.png --device ipad
# JPEG output with white background
appshot frame screenshot.png --format jpegThe frame command uses intelligent heuristics to detect device type:
- Apple Watch - Small, square-ish images (< 600k pixels, aspect ratio 0.75-1.3)
- iPad - 4:3 aspect ratio (1.20-1.40) with 1.5M-8M pixels
- Mac - 16:10 or 16:9 aspect ratio (1.50-1.85) with 2M+ pixels
- iPhone - Tall aspect ratios (1.60-2.40) with < 5M pixels
When dimensions are ambiguous, use --device to specify the target device.
Appshot auto-detects orientation and selects the best-fitting device frame for each screenshot. Frames are always based on the full device image; the screenshot is inset into the frameβs screenRect.
# Disable frames entirely
appshot build --no-frame
# Frame-only mode (no captions or gradients)
appshot frame ./screenshotsCaptions render inside fixed layout zones (header/footer only). Text is centered within the caption region and truncated with ellipsis if it exceeds the max line count for the device. Font size is computed from output dimensions, with device-specific min/max bounds.
{
"version": 2,
"layout": "header",
"caption": {
"font": "SF Pro Display Bold",
"color": "#FFFFFF",
"background": {
"color": "#000000",
"opacity": 0.75
}
}
}Tips:
- Use
appshot build --dry-run --verboseto inspect computed regions and sizes. - Use
appshot styleto pick layout + gradient + caption color. - Use
appshot captionto edit caption text per device.
Browse the current v2 template gallery in template-samples/index.html.
The caption command includes intelligent autocomplete:
appshot caption --device iphone
# Features:
# - Fuzzy search
# - Frequency tracking
# - Device-specific suggestions
# - Pattern detectionKeyboard shortcuts:
- Tab - Complete suggestion
- ββ - Navigate suggestions
- Enter - Select
- Esc - Dismiss
Appshot integrates with OpenAI for instant caption translation.
export OPENAI_API_KEY="your-api-key-here"# Translate as you type
appshot caption --device iphone --translate --langs es,fr,de
# Output:
# ? home.png: Welcome to the future
# es: Bienvenido al futuro
# fr: Bienvenue dans le futur
# de: Willkommen in der Zukunft# Translate all existing captions
appshot localize --langs es,fr,de,ja,zh-CN
# Device-specific translation
appshot localize --device iphone --langs es,fr
# Use premium model
appshot localize --langs ja,ko --model gpt-5
# Review before saving
appshot localize --langs es --review| Model Series | Best For | Parameter | Temperature |
|---|---|---|---|
| GPT-4o | Fast, cost-effective | max_tokens |
0.3 |
| GPT-5 | High-quality, nuanced | max_completion_tokens |
1.0 |
| o1 | Deep reasoning | max_completion_tokens |
1.0 |
| o3 | State-of-the-art | max_completion_tokens |
1.0 |
25+ languages including:
- European: es, fr, de, it, pt, nl, sv, no, da, fi, pl, ru
- Asian: ja, ko, zh-CN, zh-TW, hi, th, vi, id, ms
- Middle Eastern: ar, he, tr
- Variants: pt-BR
# 1. Add captions with translation
appshot caption --device iphone --translate --langs es,fr
# 2. Build localized screenshots
appshot build --langs en,es,fr
# Output structure (always uses language subdirectories):
# final/
# iphone/
# en/
# es/
# fr/| Device | Orientations | Frame Variants | Special Features |
|---|---|---|---|
| iPhone | Portrait, Landscape | 15+ models | Notch/Dynamic Island support |
| iPad | Portrait, Landscape | 10+ models | Multiple sizes |
| Mac | Landscape | 4 resolutions | 16:10 aspect ratio |
| Apple Watch | Portrait | 5 sizes | Band cropping |
| Apple TV | Landscape | HD, 4K | TV frame |
| Vision Pro | Landscape | 3840Γ2160 | Spatial computing |
iPhone (choose one):
- 6.9" Display: 1290Γ2796 (iPhone 16/15 Pro Max)
- 6.5" Display: 1284Γ2778 (iPhone 14 Plus)
iPad:
- 13" Display: 2064Γ2752 or 2048Γ2732
Mac:
- 16:10 aspect: 2880Γ1800, 2560Γ1600, 1440Γ900, or 1280Γ800
Apple Watch:
- Must use same size across all localizations
# View all presets
appshot presets
# Show required only
appshot presets --required
# Generate config for specific presets
appshot presets --generate iphone-6-9,ipad-13
# Build with presets
appshot build --preset iphone-6-9,ipad-13# Validate against App Store requirements
appshot validate
# Strict mode (required presets only)
appshot validate --strict
# Get fix suggestions
appshot validate --fixAppshot seamlessly integrates with Fastlane for uploading screenshots to App Store Connect. The export command reorganizes your Appshot-generated screenshots into Fastlane's expected directory structure.
Appshot and Fastlane work together but remain separate tools:
- Appshot: Generates beautiful screenshots with frames, gradients, and captions
- Fastlane: Uploads screenshots to App Store Connect
# 1. Generate screenshots with Appshot
appshot build --preset iphone-6-9,ipad-13
# 2. Export for Fastlane (auto-detects languages)
appshot export
# 3. Upload with Fastlane
cd fastlane && fastlane deliverThe appshot export command bridges Appshot and Fastlane:
# Basic export (auto-detects languages, creates symlinks)
appshot export
# Export specific devices only
appshot export --devices iphone,ipad
# Copy files instead of symlinks (for CI/CD)
appshot export --copy --clean
# Generate Fastlane configuration
appshot export --generate-config
# Preview without creating files
appshot export --dry-run
# Custom paths
appshot export --source ./my-screenshots --output ./uploadAppshot automatically maps language codes to Fastlane format:
enβen-USesβes-ESfrβfr-FRdeβde-DEzhβzh-Hansptβpt-PT- [and 20+ more mappings]
Custom mappings via .appshot/export-config.json:
{
"languageMappings": {
"en": "en-GB",
"custom": "x-special"
}
}Appshot Output (source):
final/
βββ iphone/
β βββ en/
β β βββ home.png
β β βββ features.png
β βββ es/
β βββ home.png
βββ ipad/
βββ en/
βββ home.png
Fastlane Structure (after export):
fastlane/screenshots/
βββ en-US/
β βββ iphone/
β β βββ home.png
β β βββ features.png
β βββ ipad/
β βββ IPAD_PRO_3GEN_129_home.png # Auto-renamed
βββ es-ES/
βββ iphone/
βββ home.png
iPad Pro 12.9" (3rd gen) screenshots are automatically renamed with the IPAD_PRO_3GEN_129_ prefix for proper Fastlane recognition.
- Default: Creates symlinks (saves disk space, instant)
- CI/CD: Use
--copyfor portable archives - Clean: Use
--cleanto remove old exports before creating new ones
π Important Discovery: Fastlane uploads screenshots in alphabetical order by filename. Without explicit ordering, your carefully arranged screenshots may appear in the wrong sequence on the App Store!
When exporting screenshots for Fastlane, the alphabetical ordering can disrupt your intended flow:
- β Without ordering:
bluesky.png,cast.png,home.png,media.png,updates.png - β
With ordering:
01_home.png,02_updates.png,03_cast.png,04_media.png,05_bluesky.png
# Set order interactively for each device
appshot order --device iphone
appshot order --device ipad
appshot order --device watch
# Export with numeric prefixes
appshot export --order --copy --clean
# View current order
appshot order --showThe order configuration is saved in .appshot/screenshot-order.json and intelligently handles:
- Files with existing numeric prefixes (prevents double-prefixing like
01_01_home.png) - Mixed naming conventions in your source files
- New screenshots added after initial ordering
Create a standard order configuration:
cat > .appshot/screenshot-order.json << 'EOF'
{
"version": "1.0",
"orders": {
"iphone": ["home.png", "features.png", "search.png", "profile.png", "settings.png"],
"ipad": ["home.png", "features.png", "search.png", "profile.png", "settings.png"],
"watch": ["home.png", "features.png", "profile.png"]
}
}
EOFπ Key Discoveries from Real-World Integration
Problem: Fastlane's deliver command struggles with nested device directories inside language folders.
Solution: Appshot automatically flattens the structure during export:
# Appshot structure (nested):
final/iphone/en/home.png β
# Fastlane structure (flattened):
fastlane/screenshots/en-US/iphone/home.pngDiscovery: Some devices require specific filename prefixes for Fastlane to recognize them correctly.
Handled Automatically:
- iPad Pro 12.9" (3rd gen) β
IPAD_PRO_3GEN_129_prefix - iPad Pro 11" β
IPAD_PRO_11_prefix
For complex projects with many screenshots, use the staging approach in your Fastfile:
lane :upload_screenshots_staged do
# Flattens nested structures for Fastlane compatibility
# Handles device prefixes automatically
# See full implementation in Fastlane export --generate-config
endImportant: Never commit your api_key.json to version control!
# Use the template
cp fastlane/api_key.json.template fastlane/api_key.json
# Edit with your credentials
# Add to .gitignore (done automatically by export --generate-config)# 1. Initialize Appshot project
appshot init
# 2. Add your raw screenshots
# Place them in screenshots/iphone/home.png, etc.
# 3. Generate styled screenshots
appshot build --preset iphone-6-9,ipad-13 --langs en,es,fr
# 4. Export for Fastlane with config generation
appshot export --generate-config
# 5. Configure Fastlane (one-time setup)
cd fastlane
# Edit Deliverfile with your App Store Connect credentials
# app_identifier "com.example.myapp"
# username "your@email.com"
# 6. Upload to App Store Connect
fastlane deliver --skip_metadata --skip_app_version_update
# 7. For updates, just rebuild and re-export
appshot build --preset iphone-6-9,ipad-13
appshot export --clean
cd fastlane && fastlane deliver# GitHub Actions Example
- name: Generate Screenshots
run: |
npm install -g appshot-cli
appshot build --preset iphone-6-9,ipad-13
- name: Export for Fastlane
run: appshot export --copy --clean
- name: Upload to App Store
env:
APP_STORE_CONNECT_API_KEY: ${{ secrets.ASC_API_KEY }}
run: |
cd fastlane
fastlane deliver --api_key_path api_key.jsonThe export command includes comprehensive validation:
- Checks for valid output directory permissions
- Validates language codes against Fastlane's supported set
- Warns about missing screenshots for requested devices
- Suggests App Store required presets if missing
# Preview and validate
appshot export --dry-run --verbose
# Check what would be exported
appshot export --dry-run --json | jqWith --generate-config, Appshot creates:
- Deliverfile: Screenshot configuration
- Fastfile: Upload lanes
- README.md: Instructions
- .gitignore: Excludes screenshots
Example generated Deliverfile:
# Generated by Appshot
screenshots_path "./screenshots"
languages ["en-US", "es-ES", "fr-FR"]
skip_binary_upload true
skip_metadata true
overwrite_screenshots true- Language Detection: Let Appshot auto-detect languages from your screenshots
- Device Filtering: Export only what you need with
--devices - Dry Run First: Always preview with
--dry-runbefore actual export - Validation: Run
appshot validatebefore export to ensure compliance - Incremental Updates: Use
--cleanto ensure fresh exports
Get started with App Store screenshots in seconds with interactive setup.
appshot quickstart [options]Options:
--template <id>- Template to use (default: ocean-header)--caption <text>- Main caption for screenshots--no-interactive- Skip interactive prompts--force- Overwrite existing configuration
What it does:
- Creates project structure
- Applies professional template
- Sets up example captions
- Shows next steps
Examples:
# Interactive setup
appshot quickstart
# Quick setup with template
appshot quickstart --template pastel-header --caption "My App"
# Non-interactive
appshot quickstart --template noir-footer --no-interactiveOne-shot v2 flow that sets layout, captions, translations, enhancement, and build in a single pass.
appshot wizard [options]Options:
--devices <list>- Comma-separated device list (default: iphone)--layout <mode>- header | footer | screenshot-only--template <id>- Apply a v2 template preset (ocean-header, sunset-footer, clean-screenshot, etc.)--caption-source <mode>- filenames | manual--langs <codes>- Languages to build (default: en,es,fr)--model <name>- OpenAI model (default: gpt-5-mini)--enhance/--no-enhance- Toggle caption enhancement (default: on)--no-interactive- Skip prompts (CI-friendly)--dry-run- Print the planned commands only--require-ai- Fail if AI steps are requested but OPENAI_API_KEY is missing
What it does:
- Ensures v2 config
- Applies a template (optional) or sets layout
- Auto-detects screenshot resolution + orientation (when available)
- Generates captions (auto or manual)
- Translates (if languages > 1)
- Enhances captions (optional)
- Builds screenshots
Examples:
# Interactive wizard
appshot wizard
# Non-interactive with template + translations
appshot wizard --no-interactive --devices iphone,ipad --template ocean-header --caption-source filenames --langs en,es,frApply professional screenshot templates for instant visual styling.
appshot template [template] [options]Arguments:
[template]- Template ID (ocean-header, sunset-footer, clean-screenshot, pastel-header, noir-footer, silver-header, tropical-header, slate-footer, midnight-header)
Options:
--list- List all available templates--preview <id>- Preview template configuration--caption <text>- Add caption to all screenshots--device <name>- Apply to specific device only--no-backup- Skip config backup--dry-run- Preview without applying
Examples:
# List templates
appshot template --list
# Apply template
appshot template ocean-header
# With caption
appshot template pastel-header --caption "Beautiful App"
# Preview settings
appshot template --preview noir-footer
# Device-specific
appshot template silver-header --device iphoneUltra-simple one-line commands to generate App Store screenshots with professional templates.
appshot preset <preset-name> [options]Arguments:
<preset-name>- Template to use (ocean-header, sunset-footer, clean-screenshot, pastel-header, noir-footer, silver-header, tropical-header, slate-footer, midnight-header)
Options:
-c, --caption <text>- Add caption to all screenshots-d, --devices <list>- Comma-separated device list-l, --langs <list>- Comma-separated language codes-o, --output <path>- Output directory (default: ./final)--dry-run- Preview without building-v, --verbose- Show detailed output
Examples:
# Quick professional screenshots
appshot preset ocean-header --caption "Amazing Features"
# Multiple devices
appshot preset noir-footer --devices iphone,ipad,watch
# Multiple languages
appshot preset pastel-header --langs en,es,fr,de
# Custom output
appshot preset silver-header --output ./marketing/screenshots
# Preview mode
appshot preset slate-footer --dry-run
# Full example
appshot preset clean-screenshot \
--caption "Summer Sale!" \
--devices iphone,ipad \
--langs en,es,fr \
--output ./app-store-assetsWhat it does:
- Applies professional template (gradient, positioning, styling)
- Adds caption to first screenshot if provided
- Builds screenshots for specified devices and languages
- All in one command - perfect for CI/CD!
Generate final screenshots with frames, gradients, and captions.
appshot build [options]Options:
--devices <list>- Comma-separated device list (default: all)--preset <ids>- Use App Store presets (e.g.,iphone-6-9,ipad-13)--config <file>- Custom config file (default:.appshot/config.json)--langs <list>- Build for specific languages (if not specified, auto-detects)--preview- Generate low-res previews--concurrency <n>- Parallel processing limit (default: 5)--dry-run- Show what would be rendered without generating images--verbose- Show detailed rendering information--no-frame- Skip device frames--no-gradient- Skip gradient backgrounds--no-caption- Skip captions--auto-caption- Generate captions from filenames when none exist
Language Detection:
When --langs is not specified, appshot automatically determines languages in this order:
- Languages found in caption files (if using multi-language captions)
defaultLanguagesetting in config.json- System locale (e.g.,
frfor French systems) - Fallback to
en
Examples:
# Build all devices
appshot build
# Specific devices and languages
appshot build --devices iphone,ipad --langs en,fr,es
# Use App Store presets
appshot build --preset iphone-6-9-portrait,ipad-13-landscape
# Preview mode
appshot build --preview --devices iphone
# Dry-run to see what would be built
appshot build --dry-run
# Verbose mode for debugging
appshot build --verbose --devices iphone
# Auto-generate captions from filenames
appshot build --auto-caption --devices iphoneExit Codes:
0- Success1- Configuration error2- Missing screenshots3- Processing error
Add or edit captions with autocomplete and AI translation.
appshot caption --device <name> [options]Options:
--device <name>- Device name (required)--lang <code>- Primary language (default: en)--translate- Enable real-time AI translation--langs <codes>- Target languages for translation--model <name>- OpenAI model (default: gpt-4o-mini)--auto-caption- Generate captions from filenames (non-interactive)
If OPENAI_API_KEY is missing, translation is skipped with a warning.
Examples:
# Basic caption entry
appshot caption --device iphone
# With translation
appshot caption --device iphone --translate --langs es,fr,de
# Auto-generate captions and translate (non-interactive)
appshot caption --device iphone --auto-caption --translate --langs es,fr
# Custom model
appshot caption --device ipad --translate --langs ja --model gpt-5Enhance existing captions using OpenAI without translating languages.
appshot caption enhance --device <name> [options]Options:
--device <name>- Device name (required)--lang <code>- Primary language (default: en)--langs <codes>- Languages to enhance (comma-separated)--model <name>- OpenAI model (default: gpt-5-mini)--dry-run- Preview changes without writing
Examples:
# Enhance English captions
appshot caption enhance --device iphone
# Enhance only French + Japanese captions
appshot caption enhance --device ipad --langs fr,ja
# Explicit GPT-5 model selection
appshot caption enhance --device mac --model gpt-5-miniValidate project configuration and assets.
appshot check [options]Options:
--fix- Attempt automatic fixes
Checks:
- Configuration file validity
- Screenshot presence
- Frame availability
- Directory structure
- Caption files
Remove generated files and temporary data.
appshot clean [options]Options:
--all- Remove all generated files including.appshot/--reset- Remove generated files but keepscreenshots/--history- Clear caption autocomplete history--keep-history- Preserve history when using--all--yes- Skip confirmation prompt
Examples:
# Clean output only
appshot clean
# Full reset
appshot clean --all --yes
# Reset but keep screenshots
appshot clean --reset --yes
# Clear history
appshot clean --historyRun comprehensive system diagnostics to verify appshot installation and dependencies.
appshot doctor [options]Options:
--json- Output results as JSON for CI/automation--verbose- Show detailed diagnostic information--category <categories>- Run specific checks (comma-separated: system,dependencies,fonts,filesystem,frames)
Checks:
- System Requirements - Node.js version (β₯18), npm availability, platform detection
- Dependencies - Sharp module installation, native bindings, image processing test, OpenAI API key
- Font System - Font detection commands, system font loading, common font availability
- File System - Write permissions (current/temp directories), .appshot directory, configuration validity
- Frame Assets - Frame directory presence, Frames.json validation, device frame counts, missing files
Examples:
# Run all diagnostics
appshot doctor
# Check specific categories
appshot doctor --category system,dependencies
# JSON output for CI
appshot doctor --json
# Verbose mode for debugging
appshot doctor --verboseOutput Example:
π₯ Appshot Doctor - System Diagnostics
System Requirements:
β Node.js v20.5.0 (minimum: v18.0.0)
β npm v9.8.0
β darwin (macOS)
Dependencies:
β Sharp v0.33.5 installed
β libvips v8.15.3 loaded
β Sharp image processing test passed
β OpenAI API key not found (translation features disabled)
Summary: 20 passed, 1 warning, 0 errors
Suggestions:
β’ Set OPENAI_API_KEY environment variable to enable translation features
Browse, validate, and set fonts for captions. Includes 8 high-quality embedded fonts for consistent rendering across all platforms.
appshot fonts [options]Options:
--all- List all system fonts--embedded- Show embedded fonts bundled with appshot--recommended- Show recommended fonts only (default)--validate <name>- Check if font is available (embedded or system)--set <name>- Set the caption font--select- Interactive font selection--device <name>- Target specific device (with --set or --select)--json- Output as JSON
Embedded Fonts (Always Available):
- Modern UI: Inter, Poppins, Montserrat, DM Sans
- Popular Web: Roboto, Open Sans, Lato, Work Sans
- Monospace: JetBrains Mono, Fira Code
- Variants: Regular, Italic, Bold, and Bold Italic styles
All embedded fonts use open source licenses (OFL or Apache 2.0) and provide consistent rendering without requiring system installation. Font variants are automatically detected and properly rendered with correct styles.
Examples:
# Browse recommended fonts
appshot fonts
# Show embedded fonts
appshot fonts --embedded
# Set global font directly (embedded font)
appshot fonts --set "Inter"
# Set font variant (italic style)
appshot fonts --set "Poppins Italic"
# Set bold variant
appshot fonts --set "Montserrat Bold"
# Interactive font selection
appshot fonts --select
# Set device-specific font variant
appshot fonts --set "Poppins Bold Italic" --device iphone
# Validate font availability
appshot fonts --validate "Inter" # Shows: embedded
appshot fonts --validate "Arial" # Shows: system installed
# List all system fonts
appshot fonts --all
# JSON output for automation
appshot fonts --json > fonts.jsonApply device frames to screenshots with transparent backgrounds (no gradients or captions).
appshot frame <input> [options]Arguments:
<input>- Input image file or directory
Options:
-o, --output <dir>- Output directory (default: same as input)-d, --device <type>- Force device type (iphone|ipad|mac|watch)-r, --recursive- Process directories recursively-f, --format <type>- Output format: png or jpeg (default: png)--suffix <text>- Filename suffix when not overwriting (default: "-framed")--overwrite- Overwrite original file name--dry-run- Preview files without processing--frame-tone <tone>- Frame color treatment (original|neutral)--verbose- Show detailed information
Features:
- Auto-detects device type from image dimensions
- Preserves transparency with PNG output
- Batch processes entire directories
- Smart portrait/landscape frame selection
- Progress indicators for large batches
Examples:
# Frame single file (auto-detect device)
appshot frame screenshot.png
# Specify output directory
appshot frame screenshot.png -o framed/
# Force device type
appshot frame screenshot.png --device iphone
# Batch process directory
appshot frame ./screenshots -o ./framed --recursive
# Dry run with verbose logs
appshot frame ./screenshots --dry-run --verbose
# JPEG output (white background)
appshot frame screenshot.png --format jpeg
# Generate neutral (desaturated) device frames
appshot frame screenshot.png --frame-tone neutralStart the Model Context Protocol (MCP) server for AI agent integration. Enables Claude Desktop, Claude Code, and other MCP-compatible agents to control appshot directly.
appshot mcp [options]Options:
--stdio- Use stdio transport (default)
Usage: Register in Claude Desktop's config to enable AI-powered screenshot workflows. See MCP Server & Agent Integration for setup details.
appshot mcpTools exposed:
appshot_projectInfoβ Returnsappshot_jsonmetadata (devices, languages, templates).appshot_doctorβ Runs diagnostics and returns console output.appshot_buildβ Wrapsappshot buildwith options for devices, languages, and rendering flags.appshot_frameβ Batch frames screenshots (including--frame-tone neutralsupport).appshot_exportβ Runs the Fastlane export pipeline.
The server uses the stdio transport, so you can register it in Anthropic Desktop by pointing at appshot mcp (working directory = your Appshot project). The same entry point works for any MCP-compatible agent or automation.
Install the appshot skill for Claude Code. The skill provides workflow guidance, template recommendations, and troubleshooting help.
appshot skill [options]Options:
--force- Overwrite existing installation--uninstall- Remove the skill--path <dir>- Custom installation path
Examples:
# Install skill to ~/.claude/skills/appshot/
appshot skill
# Update existing installation
appshot skill --force
# Uninstall
appshot skill --uninstallSkill contents:
SKILL.md- Main documentation with workflows and scenariosreferences/templates.md- v2 template guidance and recommendations by app typereferences/gradients.md- All 24 gradient presets with colorsreferences/fonts.md- All 10 embedded font familiesreferences/troubleshooting.md- Common errors and solutions
Capture screenshots from iOS simulators.
appshot device <command> [options]Commands:
capture- Capture screenshot from devicelist- List available devicesprepare- Boot simulators
Capture Options:
-d, --device <name>- Device name or alias--all- Capture from all devices--simulators- Filter simulators--booted- Currently booted simulators--process- Auto-process with frames--app <bundleId>- Launch app before capture
Examples:
# List devices
appshot device list
# Interactive capture
appshot device capture
# Capture from specific device
appshot device capture --device "iPhone 15 Pro"
# Capture and process
appshot device capture --processMonitor directories for new screenshots with automatic processing.
appshot watch <command> [options]Commands:
start- Start watching directoriesstop- Stop the watch servicestatus- Check service statussetup- Interactive configuration
Start Options:
-d, --dirs <paths...>- Directories to watch--devices <names...>- Device names for processing--process- Auto-process with frames--frame-only- Frames only (no gradient/caption)--background- Run in background--verbose- Detailed output
Examples:
# Interactive setup
appshot watch setup
# Start in background with processing
appshot watch start --process --background
# Watch multiple directories
appshot watch start --dirs ./screenshots ./downloads
# Check status
appshot watch status --verbose
# Stop watching
appshot watch stopManage gradient presets.
appshot gradients [options]
appshot gradients selectOptions:
--list- List all presets (default)--category <name>- Filter by category--preview <id>- Generate preview image--sample- Generate all samples with HTML--apply <id>- Apply preset to project
Examples:
# Browse all
appshot gradients
# Apply preset
appshot gradients --apply ocean
# Interactive selection
appshot gradients select
# Generate samples
appshot gradients --sampleInitialize new project with scaffolding.
appshot init [options]Options:
--force- Overwrite existing files
Creates:
.appshot/config.json.appshot/captions/screenshots/directories- Default configuration
Batch translate all captions using AI.
appshot localize --langs <codes> [options]Options:
--langs <codes>- Target languages (required)--device <name>- Specific device only--model <name>- OpenAI model (default: gpt-4o-mini)--source <lang>- Source language (default: en)--review- Review before saving--overwrite- Replace existing translations
Examples:
# Translate all
appshot localize --langs es,fr,de
# Device-specific
appshot localize --device iphone --langs ja,ko
# Premium model with review
appshot localize --langs zh-CN --model gpt-5 --reviewManage App Store screenshot presets.
appshot presets [options]Options:
--list- List all presets (default)--required- Show required only--generate <ids>- Generate config for presets--category <type>- Filter by device type--output <file>- Output file for config
Examples:
# View all
appshot presets
# Required only
appshot presets --required
# Generate config
appshot presets --generate iphone-6-9,ipad-13Display complete Apple App Store screenshot specifications.
appshot specs [options]Options:
--device <name>- Filter by device type (iphone|ipad|mac|watch|appletv|visionpro)--json- Output as JSON (exact Apple specifications for diffing)--required- Show only required presets
Shows:
- Complete Apple specifications with exact resolutions
- Display sizes and device compatibility lists
- Required vs optional indicators
- Fallback notes and requirements
JSON Output for Change Tracking:
The --json flag outputs the complete Apple App Store specifications data, perfect for tracking changes over time:
# Save current specifications
appshot specs --json > apple-specs-2024-08.json
# After Apple updates (typically September)
appshot specs --json > apple-specs-2024-09.json
# See what changed
diff apple-specs-2024-08.json apple-specs-2024-09.jsonData Source: The specifications mirror Apple's official screenshot requirements and are maintained in sync with Apple's updates. The JSON output preserves all metadata including:
- Exact resolutions (e.g.,
1290x2796for iPhone 6.9") - Device groupings (which devices share requirements)
- Requirement status (mandatory vs optional)
- Fallback rules and special notes
This is particularly useful for:
- Tracking when Apple adds new device requirements
- Validating screenshot compliance before submission
- Automating screenshot generation pipelines
- Planning resource allocation for new devices
Validate screenshots against App Store requirements.
appshot validate [options]Options:
--strict- Validate required presets only--fix- Show fix suggestions
Validates:
- Resolution compliance
- Aspect ratios
- Required presets
- File formats
{
"version": 2,
"layout": "header", // header | footer | screenshot-only
"caption": {
"font": "SF Pro Display Bold",
"color": "#FFFFFF"
},
"background": {
"mode": "gradient",
"gradient": {
"colors": ["#667eea", "#764ba2"],
"direction": "top-bottom"
}
},
"devices": {
"iphone": "./screenshots/iphone",
"ipad": "./screenshots/ipad",
"mac": "./screenshots/mac",
"watch": "./screenshots/watch"
},
"output": "./final",
"frames": "./frames"
}v2 uses fixed layout zones and per-device strategies. See
docs/layout-v2.md.
Appshot is built for automation:
- Predictable - Consistent commands and outputs
- Scriptable - JSON configs, exit codes, no GUI
- Composable - Unix philosophy, pipe-friendly
- Fast - Parallel processing, no overhead
Most commands support JSON output for parsing:
# Device specs as JSON
appshot specs --json
# Font list as JSON
appshot fonts --json
# Preset data as JSON
appshot presets --json
# Validation results as JSON
appshot validate --json| Code | Meaning | Commands |
|---|---|---|
| 0 | Success | All |
| 1 | Configuration error | build, check |
| 2 | Missing files | build, validate |
| 3 | Processing error | build |
| 4 | Invalid input | All |
| 5 | API error | localize, caption |
# Process multiple devices
appshot build --devices iphone,ipad,mac
# Multiple languages
appshot build --langs en,es,fr,de,ja
# Parallel processing
appshot build --concurrency 10name: Generate Screenshots
on: [push]
jobs:
screenshots:
runs-on: macos-latest
steps:
- uses: actions/checkout@v2
- name: Setup Node
uses: actions/setup-node@v2
with:
node-version: '18'
- name: Install Appshot
run: npm install -g appshot-cli
- name: Generate Screenshots
run: |
appshot init --force
appshot gradients --apply ocean
appshot build --preset iphone-6-9,ipad-13
- name: Upload Artifacts
uses: actions/upload-artifact@v2
with:
name: screenshots
path: final/#!/bin/bash
set -e
# Configure
cat > .appshot/config.json << EOF
{
"gradient": {"colors": ["#FF5733", "#FFC300"]},
"devices": {
"iphone": {"resolution": "1290x2796"}
}
}
EOF
# Add captions programmatically
echo '{"home.png": "Welcome"}' > .appshot/captions/iphone.json
# Build
appshot build --devices iphone
# Validate
appshot validate --strict || exit 1Works with Model Context Protocol tools:
# MCP captures screenshot
mcp-screenshot capture --output ./screenshots/iphone/home.png
# Appshot processes
appshot build --devices iphone --no-interactiveimport subprocess
import json
def generate_screenshots(device, captions):
# Configure
config = {
"gradient": {"colors": ["#0077BE", "#33CCCC"]},
"devices": {
device: {"resolution": "1290x2796"}
}
}
with open('.appshot/config.json', 'w') as f:
json.dump(config, f)
# Add captions
with open(f'.appshot/captions/{device}.json', 'w') as f:
json.dump(captions, f)
# Build
result = subprocess.run(
['appshot', 'build', '--devices', device],
capture_output=True,
text=True
)
return result.returncode == 0
# Usage
captions = {
"home.png": "Your Dashboard",
"settings.png": "Customize Everything"
}
generate_screenshots("iphone", captions)import { exec } from 'child_process';
import { writeFileSync } from 'fs';
async function generateScreenshots() {
// 1. Initialize
await execPromise('appshot init --force');
// 2. Configure
const config = {
gradient: { colors: ['#FF5733', '#FFC300'] },
caption: { font: 'SF Pro', fontsize: 64 }
};
writeFileSync('.appshot/config.json', JSON.stringify(config));
// 3. Add captions
const captions = {
'home.png': {
en: 'Welcome',
es: 'Bienvenido',
fr: 'Bienvenue'
}
};
writeFileSync('.appshot/captions/iphone.json', JSON.stringify(captions));
// 4. Build with multiple languages
await execPromise('appshot build --langs en,es,fr');
}
function execPromise(cmd) {
return new Promise((resolve, reject) => {
exec(cmd, (error, stdout) => {
if (error) reject(error);
else resolve(stdout);
});
});
}# 1. Initialize project
appshot init
# 2. Configure for App Store
appshot presets --generate iphone-6-9,ipad-13 > .appshot/config.json
# 3. Add screenshots
cp simulator/*.png screenshots/iphone/
# 4. Add captions with translation
export OPENAI_API_KEY="sk-..."
appshot caption --device iphone --translate --langs es,fr,de,ja,zh-CN
# 5. Apply premium gradient
appshot gradients --apply twilight
# 6. Configure styling
appshot style --device iphone
# 7. Build all localizations
appshot build --preset iphone-6-9,ipad-13 --langs en,es,fr,de,ja,zh-CN
# 8. Validate
appshot validate --strict
# 9. Output ready in final/For identical device positioning across all screenshots (v2 uses fixed zones):
{
"version": 2,
"layout": "header",
"caption": {
"font": "SF Pro Display Bold",
"color": "#FFFFFF"
},
"background": {
"mode": "gradient",
"gradient": {
"colors": ["#111111", "#333333"],
"direction": "top-bottom"
}
},
"devices": {
"iphone": "./screenshots/iphone"
}
}{
"version": 2,
"layout": "header",
"background": {
"mode": "gradient",
"gradient": {
"colors": ["#BrandColor1", "#BrandColor2"],
"direction": "diagonal"
}
},
"caption": {
"font": "Brand Font Name",
"color": "#BrandTextColor"
}
}# Configure each device
appshot style --device iphone
appshot style --device ipad
appshot style --device mac
# Build all at once
appshot build --devices iphone,ipad,mac --langs en,es,fr
# Output structure (language subdirectories):
# final/
# iphone/
# en/ es/ fr/
# ipad/
# en/ es/ fr/
# mac/
# en/ es/ fr/# Version A - Ocean gradient
appshot gradients --apply ocean
appshot build --devices iphone --output final-ocean
# Version B - Sunset gradient
appshot gradients --apply sunset
appshot build --devices iphone --output final-sunset
# Version C - Monochrome
appshot gradients --apply noir
appshot build --devices iphone --output final-noir# Check path configuration
appshot check
# Verify screenshot location
ls screenshots/iphone/
# Fix: Update config
{
"devices": {
"iphone": {
"input": "./correct/path/to/screenshots"
}
}
}# 1. Validate font availability
appshot fonts --validate "Font Name"
# 2. Use fallback font
appshot fonts --recommended
# 3. Set web-safe font
{
"caption": {
"font": "Arial" // Always works
}
}# Check API key
echo $OPENAI_API_KEY
# Test with different model
appshot caption --device iphone --translate --model gpt-4o-mini
# Check rate limits
# Wait 60 seconds between large batches# Ensure high-res input
# Minimum: 1242x2208 for iPhone
# v2 uses fixed layout zones and deterministic device scaling.
# If output is blurry, use higher-res inputs or match the exact device resolution.
# You can also try --no-frame to remove any frame scaling.# Reduce concurrency
appshot build --concurrency 2
# Process in batches
appshot build --devices iphone
appshot build --devices ipadUse --verbose flag to diagnose rendering issues:
# See detailed caption metrics
appshot build --verbose --devices iphone
# Output includes:
# - Caption wrap width and line count
# - Font stack with fallbacks
# - Device frame scaling factors
# - Position calculationsUse --dry-run to validate configuration without processing:
# Check what would be generated
appshot build --dry-run
# Verify frame selection
appshot build --dry-run --devices iphone
# Check multi-language output
appshot build --dry-run --langs en,es,fr-
Use appropriate concurrency
# For 8GB RAM appshot build --concurrency 3 # For 16GB+ RAM appshot build --concurrency 8
-
Optimize images before processing
# Use imagemagick to optimize mogrify -quality 95 screenshots/iphone/*.png
-
Cache translations
- Translations are automatically cached
- Reuse improves speed and reduces costs
-
Use preview mode for testing
appshot build --preview
| Error | Cause | Solution |
|---|---|---|
Frame not found |
Missing frame file | Run appshot check --fix |
Invalid resolution |
Wrong dimensions | Check with appshot validate |
Font validation failed |
Font not available | Use appshot fonts to find alternatives |
API rate limit |
Too many requests | Add delays or reduce batch size |
Out of memory |
Large images | Reduce concurrency or image size |
# Clone repository
git clone https://github.com/chrisvanbuskirk/appshot.git
cd appshot
# Install dependencies
npm install
# Build TypeScript
npm run build
# Run tests
npm test
# Link for local development
npm link
# Run in development mode
npm run dev -- build --devices iphoneappshot/
βββ src/
β βββ cli.ts # Entry point
β βββ commands/ # Command implementations
β βββ core/ # Core functionality
β βββ services/ # Services (fonts, translation, etc)
β βββ types/ # TypeScript type definitions
β βββ utils/ # Utility functions
β βββ types.ts # Main type definitions
βββ tests/ # Test files
β βββ integration/ # Integration tests
β βββ visual/ # Visual regression tests
βββ fonts/ # Embedded font files
β βββ Inter/
β βββ Poppins/
β βββ Montserrat/
β βββ ... # 10+ font families
βββ frames/ # Device frame images
βββ assets/ # Static assets
β βββ specs/ # App Store specifications
β βββ frames/ # Frame metadata
βββ examples/ # Example projects
βββ minimal-project/ # Basic example setup
Appshot includes comprehensive test coverage with unit tests, integration tests, and CI/CD validation.
-
Unit Tests (50+ test files)
- Device detection and frame selection
- Gradient rendering and presets
- Font validation and fallbacks
- Caption positioning and text wrapping
- Multi-language support
- App Store specifications validation
-
Integration Tests (
tests/integration/)- Full CLI command testing
- End-to-end workflow validation
- Multi-platform compatibility
- Error handling scenarios
-
CI/CD Testing
- Automated testing on every PR
- Multi-OS testing (Ubuntu, macOS, Windows)
- Multi-Node version testing (18.x, 20.x, 22.x)
- Visual validation workflows
- Screenshot artifact generation
# Run all tests
npm test
# Run specific test
npm test -- fonts.test.ts
# Run integration tests
npm test -- tests/integration/cli-integration.test.ts
# Watch mode
npm run test:watch
# Run with coverage
npm run test:coverageWe welcome contributions! Please:
- Fork the repository
- Create a feature branch
- Add tests for new features
- Ensure all tests pass
- Submit a pull request
See CONTRIBUTING.md for details.
- Official App Store specifications
- Layout v2 fixed zones (header/footer/screenshot-only)
- Intelligent caption autocomplete
- Apple Watch optimizations
- Gradient presets system (24+ gradients)
- AI-Powered Translations (GPT-4o, GPT-5, o1, o3)
- Comprehensive Font System (v0.4.0)
- Frame-Only Mode (v0.8.0)
- MCP Server with 17 tools (v2.0.0)
- Claude Code Skill (v2.0.0)
- Fastlane Export Integration
- Professional Template System (v2)
- Auto-Caption from Filenames
- Claude Desktop MCP compatibility β (v2.0.0)
- Android Device Support (Google Play Store)
- GitHub Actions Marketplace Action
- CI/CD Templates (Jenkins, GitLab CI, CircleCI)
- AI-Powered Caption Enhancement (OpenAI)
- WebP/AVIF Support
- Screenshot A/B Testing Framework
- Differential Builds
MIT Β© Chris Van Buskirk
- π Report Issues
- π‘ Request Features
- π Documentation Wiki
- π¬ Discussions
For security vulnerabilities, please see SECURITY.md.
- π¦ appshot-cli on NPM
- π Latest version: 2.0.0








