FloImg Studio

FloImg Studio is a visual drag-and-drop interface for building image generation workflows.

What is FloImg Studio?

FloImg Studio provides a graphical way to:

• Build image workflows without code
• Preview results in real-time
• Export workflows as JSON for the SDK or CLI
• Share workflows with your team

Self-Hosted vs Managed

FloImg Studio is open-source and self-hostable. Run it on your own infrastructure with your own API keys.

docker run -p 5100:5100 ghcr.io/teamflojo/floimg-studio

Prefer not to manage infrastructure? A hosted version is available at studio.floimg.com.

Quick Start

Using Docker

# Pull and run
docker run -p 5100:5100 ghcr.io/teamflojo/floimg-studio

# Open in browser
open http://localhost:5100

From Source

FloImg Studio is part of the floimg monorepo:

git clone https://github.com/teamflojo/floimg.git
cd floimg
pnpm install
pnpm dev:studio

The Interface

Canvas

The main workspace where you build workflows. Drag nodes from the sidebar and connect them to create pipelines.

Node Types

Node	Description
Generate	Create images (charts, diagrams, QR codes)
Transform	Modify images (resize, blur, convert)
Output	Save or export the result

Connections

Connect nodes by dragging from output ports to input ports. Data flows left to right.

Preview Panel

See real-time previews of each node’s output as you build.

Features

Real-Time Preview

Every node shows a live preview. Change parameters and see results instantly.

Export Options

Export your workflow as:

• JSON - For the SDK or CLI
• Code - TypeScript snippet
• Image - Download the final result

Workflow Library

Save and organize workflows. Share with team members.

Keyboard Shortcuts

Shortcut	Action
Space	Pan canvas
Cmd/Ctrl + Z	Undo
Cmd/Ctrl + S	Save workflow
Delete	Remove selected node
Cmd/Ctrl + D	Duplicate node

See Also

• Building Workflows - Step-by-step guide
• Node Reference - All available nodes
• Self-Hosting - Deployment guide