> ## Documentation Index
> Fetch the complete documentation index at: https://docs.tryflowy.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Image Node

> Generate and edit images with references, resolutions up to 4K, and photobooth mode.

export const VideoPlayer = ({src, poster, aspectRatio = "16 / 9", title, className = ""}) => {
  const [playing, setPlaying] = useState(false);
  if (playing) {
    return <div className={`not-prose relative mx-auto my-6 w-full max-w-screen-md overflow-hidden rounded-2xl border border-gray-950/10 dark:border-white/10 ${className}`} style={{
      aspectRatio
    }}>
        <video src={src} controls autoPlay playsInline className="h-full w-full object-contain" />
      </div>;
  }
  return <button type="button" aria-label={title ? `Play video: ${title}` : "Play video"} style={{
    aspectRatio
  }} className={`not-prose group relative mx-auto my-6 block w-full max-w-screen-md cursor-pointer overflow-hidden rounded-2xl border border-gray-950/10 bg-gray-100 dark:border-white/10 dark:bg-white/5 ${className}`} onClick={() => setPlaying(true)}>
      <img src={poster} alt={title || "Video thumbnail"} className="h-full w-full cursor-pointer object-cover" />
      <div className="absolute inset-x-0 bottom-0 h-20 bg-gradient-to-t from-black/80 to-transparent sm:h-28" />
      <div className="absolute bottom-6 flex w-full items-center justify-between px-6">
        <p className="max-w-sm text-left text-lg font-semibold leading-tight text-white">
          {title}
        </p>
        <div className="rounded-full p-3 shadow-lg transition-all duration-300 group-hover:scale-110 group-active:scale-95" style={{
    backgroundColor: "#5C9987"
  }}>
          <svg width="24" height="24" viewBox="0 0 24 24" fill="#ffffff" aria-hidden="true">
            <path d="M8 5v14l11-7L8 5z" />
          </svg>
        </div>
      </div>
    </button>;
};

The Image node turns a prompt into a still image — and doubles as the anchor for references, edits, and every image tool on the canvas.

<VideoPlayer src="/videos/canvas/node-image.mp4" poster="/images/posters/canvas/node-image.jpg" title="Watch: generating images with references and resolutions" />

## Generate an image

Write a prompt in the node's prompt bar, pick your settings, and click **Run**. Name the subject, the setting, the visual style, and the lighting — specific prompts give specific results.

| Setting      | Choices                                                                 |
| ------------ | ----------------------------------------------------------------------- |
| Aspect ratio | `1:1`, `2:3`, `3:2`, `3:4`, `4:3`, `4:5`, `5:4`, `9:16`, `16:9`, `21:9` |
| Size         | `1K`, `2K`, `4K`                                                        |

Reach for `1K` when you're drafting and iterating, and `4K` when you need a crisp final output with detail to spare.

<Frame caption="An Image node: drop or upload a reference, write a prompt, and set aspect ratio and resolution before you Run">
  <img src="https://mintcdn.com/flamapp/Ht3d9_jt2Rn5fhsi/images/image-node.png?fit=max&auto=format&n=Ht3d9_jt2Rn5fhsi&q=85&s=5cac73ea4d970315cc31bf802db7fd81" alt="An Image node with a prompt, reference, and generation settings" width="1512" height="805" data-path="images/image-node.png" />
</Frame>

## Reference images

Connect other Image nodes — generated or uploaded — as references, and describe in the prompt how to use them. References keep characters, products, and color palettes consistent across generations, and they're how you do image edits: connect the source image, then prompt the change you want.

## Modes

The Image node has two generation modes:

* **Standard** — the normal path: text-to-image, image edits, and reference-conditioned generation.
* **Photobooth** — connect a reference image of a product or subject, and the node generates a set of commercial photoshoot template variations from it. Add a text prompt to steer the direction. Photobooth needs the connected image first — a prompt alone won't run.

## Visual analysis

The [AI assistant](/canvas/ai/overview) can inspect an Image node's actual pixels — not only its prompt — so you can ask it to describe a result, critique a composition, or decide which of several variants to carry forward.

## Edit with image tools

Every Image node connects into the canvas [image tools](/canvas/image-tools/overview): upscale, inpaint, outpaint, remove background, change angle, separate layers, and a set of local adjustments like crop, levels, and blur. Chain them after a generation to refine the result without leaving the canvas.