Image generation · Generate image with FLUX.2-klein split layout5 / 7
  1. 01
  2. 02
  3. 03
  4. 04
  5. 06
  6. 07

Generate image with FLUX.2-klein split layout

Example on GitHub(packages/sdk/examples/diffusion-flux2-klein.ts)

We've used a single model file so far. FLUX.2-klein needs three: a diffusion model, a text encoder, and a VAE.

The diffusion model is the inference engine. It iteratively refines a noise field step by step until the result matches your prompt. The text encoder produces the tokens the engine reads. The VAE encodes the working state in latent space and decodes the final image back to pixels.

The three files are independent. The SDK downloads each one on its own schedule, then wires them together at load time.

FLUX.2-klein split-layout is three files in one loadModel call: diffusion model, LLM encoder, VAE. The pipeline: LLM → tokens → diffusion → latent → VAE → pixels. The combined load would look like the following:

const modelId = await loadModel({
  modelSrc: FLUX_2_KLEIN_4B_Q4_0,
  modelType: "sdcpp-generation",
  modelConfig: {
    llmModelSrc: QWEN3_4B_Q4_K_M,
    vaeModelSrc: FLUX_2_KLEIN_4B_VAE,
  },
});

From the caller's perspective, split-layout vs single-file is invisible. The outputs array is the same shape as for a single-file model: a Promise<Uint8Array[]> of PNG bytes:

const result = diffusion({ modelId, prompt: "a quiet harbor at dawn" });
const outputs = await result.outputs;

outputs[0] is the first PNG, fs.writeFileSync writes raw bytes (no header needed), and an empty array means the call failed silently. Here's how an example would look like:

const first = outputs[0];
if (first) fs.writeFileSync("../../apps/desktop/output/image-gen/harbor.png", first);
console.log(`Generated ${outputs.length} image`);

Note: the SDK only downloads the files that aren't already on disk. The second run with the same constants skips the download and goes straight to inference.

Put it to the test

  1. Call loadModel with modelType: "sdcpp-generation", modelSrc: FLUX_2_KLEIN_4B_Q4_0, and a modelConfig block holding the LLM encoder and VAE.
  2. Call diffusion({ modelId, prompt }) and await result.outputs.
  3. Write outputs[0] to a PNG and log the image count.
index.ts

$ Run your code to see results

$