Commands Reference

The floimg plugin provides six slash commands for composable image workflows. The most powerful commands use MCP for session state and iteration. Simple generators work immediately via CLI.

AI Workflow Commands (MCP)

These commands enable the full power of FloImg: multi-step pipelines, iterative refinement, and session state. Restart Claude Code once after installing the plugin to enable MCP.

/floimg:image

Universal image generation - Generates any type of image based on your description. Uses MCP for transforms and iteration.

Usage

/floimg:image <description>

Routing Keywords

Keywords	Generator	Result
photo, picture, illustration, scene	OpenAI/DALL-E	AI-generated image
chart, graph, bar, line, pie	QuickChart	Data visualization
flowchart, diagram, sequence	Mermaid	Technical diagram
QR, qr code	QR	QR code
screenshot, capture, webpage	Screenshot	Webpage capture

Examples

/floimg:image a golden retriever in a field at sunset
/floimg:image bar chart of monthly sales data
/floimg:image flowchart showing user registration process

Why MCP?

The /floimg:image command benefits from MCP because:

• Iteration: “Make it more vibrant” transforms the existing result
• Chaining: Generate → resize → caption → save in one conversation
• Session state: Reference images by ID across operations

Fallback

If MCP is not available, the command falls back to CLI for simple one-shot generation.

---

/floimg:workflow

Multi-step pipelines - Executes generate, transform, and save operations in sequence.

Usage

/floimg:workflow <description>

Pipeline Structure

Workflows combine three operation types:

1. Generate - Create the initial image
2. Transform - Modify the image (resize, blur, caption, etc.)
3. Save - Store to filesystem or cloud

Transform Operations

Operation	Description	Key Parameters
resize	Scale image	width, height, fit
convert	Change format	to (png, jpeg, webp)
blur	Gaussian blur	sigma (0.3-1000)
sharpen	Sharpen edges	sigma
grayscale	Remove color	-
modulate	Adjust colors	brightness, saturation, hue
roundCorners	Border radius	radius
addText	Overlay text	text, x, y, size, color
addCaption	Caption bar	text, position, background
preset	Apply filter	name (vintage, vibrant, dramatic, soft)

Examples

/floimg:workflow Create a hero image for my blog, resize to 1200x630, add "Welcome" caption, save to ./social/
/floimg:workflow Generate a product photo, create 100px and 200px thumbnails with rounded corners
/floimg:workflow Create a chart of Q1 sales, add company watermark, upload to S3 bucket

Iterative Refinement

With MCP session state:

User: "Create a hero image for my AI startup"
→ generate_image(...) → imageId: "img_001"

User: "Make it more vibrant"
→ transform_image({ imageId: "img_001", operation: "modulate", params: { saturation: 1.3 } })
→ imageId: "img_002"

User: "Add our tagline at the bottom"
→ transform_image({ imageId: "img_002", operation: "addCaption", params: { text: "AI for Everyone" } })
→ imageId: "img_003"

User: "Perfect, save it"
→ save_image({ imageId: "img_003", destination: "./hero.png" })

Save Destinations

Type	Format	Example
Local	Relative/absolute path	./output/image.png
S3	s3://bucket/key	s3://my-bucket/images/hero.png
R2	r2://bucket/key	r2://cdn-bucket/assets/logo.png
Tigris	tigris://bucket/key	tigris://media/uploads/photo.jpg

Why MCP?

The /floimg:workflow command requires MCP because:

• Session state: Reference imageId without file paths
• Efficiency: Images stay in memory between transforms
• Natural language: Describe what you want, floimg plans the steps

---

Simple Generators (CLI)

These commands work immediately after installing the plugin - no MCP setup required. They use npx under the hood for quick one-shot generation.

/floimg:qr

QR code generation - Creates QR codes for URLs, text, or structured data.

Usage

/floimg:qr <content>

Examples

/floimg:qr https://floimg.com
/floimg:qr https://floimg.com/docs high quality, 500px

Content Types

Type	Format
URL	https://example.com
Plain text	Any text string
WiFi	WIFI:T:WPA;S:NetworkName;P:Password;;
vCard	BEGIN:VCARD...END:VCARD
Email	mailto:user@example.com
Phone	tel:+1234567890

CLI Command

Runs under the hood:

npx -y @teamflojo/floimg qr "CONTENT" -o ./qr-output.png

---

/floimg:chart

Data visualization - Creates charts and graphs using QuickChart.

Usage

/floimg:chart <description with data>

Supported Chart Types

Type	Best For
bar / horizontalBar	Categorical comparisons
line	Trends over time
pie / doughnut	Parts of a whole
radar	Multi-variable comparison
scatter / bubble	Correlation analysis

Examples

/floimg:chart bar chart showing Q1: $100K, Q2: $150K, Q3: $175K, Q4: $200K
/floimg:chart pie chart of market share: Us 45%, Competitor A 30%, Others 25%
/floimg:chart line chart comparing 2023 vs 2024 revenue by month

CLI Command

Runs under the hood:

npx -y @teamflojo/floimg chart bar --labels "Q1,Q2,Q3,Q4" --values "100,150,175,200" -o ./chart.png

---

/floimg:diagram

Technical diagrams - Generates Mermaid diagrams for documentation and architecture.

Usage

/floimg:diagram <description>

Diagram Types

Type	Syntax	Use Case
Flowchart	graph TD / graph LR	Process flows
Sequence	sequenceDiagram	API interactions
Class	classDiagram	OOP relationships
State	stateDiagram-v2	Lifecycles
Gantt	gantt	Project timelines
ER	erDiagram	Database schemas
Mindmap	mindmap	Brainstorming

Examples

/floimg:diagram user login flow: enter credentials -> validate -> success or show error
/floimg:diagram sequence diagram of API auth: user -> API -> database -> response
/floimg:diagram microservices architecture with frontend, API gateway, and three services

CLI Command

Runs under the hood:

npx -y @teamflojo/floimg diagram "graph TD; A-->B-->C" -o ./diagram.png

---

/floimg:screenshot

Webpage capture - Takes screenshots of any webpage using Playwright.

Usage

/floimg:screenshot <url> [options]

Examples

/floimg:screenshot https://github.com
/floimg:screenshot https://docs.floimg.com full page
/floimg:screenshot https://example.com mobile view iPhone 14

Common Viewport Sizes

Device	Width	Height
Desktop HD	1920	1080
Desktop	1280	720
iPad Pro	1024	1366
iPhone 14 Pro	393	852

CLI Command

Runs under the hood:

npx -y @teamflojo/floimg screenshot "https://github.com" -o ./screenshot.png

---

Summary

Command	Type	Works Immediately?
/floimg:image	MCP	After restart
/floimg:workflow	MCP	After restart
/floimg:qr	CLI	Yes
/floimg:chart	CLI	Yes
/floimg:diagram	CLI	Yes
/floimg:screenshot	CLI	Yes