Layout prompts for MOSS-Image (Standalone & SwarmUI extension)
Layout prompts for MOSS-Image (Standalone & SwarmUI extension)
MOSS-Image can read a prompt that says not only what is in the picture, but where. You describe the whole scene, then add boxes: "this title goes here", "this character stands there", "this name goes under her". The model then tries to keep each thing inside its box.
This is useful whenever placement matters:
A title across the top and a name under each character, without the names ending up under the wrong person.
Speech bubbles in the right panel of a comic, next to the right speaker.
A magazine cover where the title, headlines, price and barcode each have their own spot.
Trying small changes: move one box, keep the same seed, and see what changes.
This article explains how these layout prompts work, how to write them, and shares a small free editor that makes drawing them easier.
SwarmUI extension: https://github.com/jambavant/SwarmUI-LayoutEditor
Standalone: https://jambavant.github.io/SwarmUI-LayoutEditor/standalone/index.html
How a layout prompt looks
A layout prompt is a small piece of JSON that you paste as the positive prompt. It has a scene caption and a list of items. Each item is either text (with the exact words to write) or object, has a short description, and has a box:
{"summary":{"meta":["poster"],"canvas":"single","caption":"A minimalist travel poster with a blue mountain and a title at the top."},
"items":[{"label":"text","caption":"Large dark-blue title centered at the top.","text":"EXPLORE","bbox":[-416,-384,-288,384]},
{"label":"object","caption":"A flat blue mountain illustration.","bbox":[-192,-288,384,288]}],
"bbox_coord_space":"abs_centralized","bbox_format":"yxyx"}The boxes are the tricky part. They are in pixels, measured from the center of the image, and written top, left, bottom, right. The numbers also only make sense for one resolution, so the image size you generate must match the size the layout was made for.
Can an LLM write it for me?
Yes, and it works well as a starting point. The MOSS-Image team even provides an official prompt-enhancer skill that turns an idea into a layout. But it is hard to check a list of numbers by reading them. When the result is off (the name is too low, the bubble covers a face), you have to guess which numbers to change, or ask again and hope for the better.
The official doc is here: https://github.com/OpenMOSS/MOSS-Image/blob/main/skills/moss-image-prompt-enhancer/references/layout.md
Why a visual editor helps
With an editor you draw the boxes and see them. Moving a title is a drag, not a calculation. You can also paste a layout that an LLM wrote, see where everything lands, fix it by hand, and generate again. The two work well together: the LLM for a first draft, the editor to get it right.
The Layout Editor
Layout Editor is a small, free, open-source tool for drawing MOSS-Image layouts. You draw boxes on a canvas, write a caption for each one, and it writes the JSON for you, with the coordinates already converted for your image size.
You can use it in two ways:
In SwarmUI, as an extension. It opens from the + button next to the prompt. Apply puts the layout in your prompt and sets the resolution. Generate creates the image without leaving the editor, and shows it under your boxes so you can compare and adjust.
In the browser, as a standalone page, with nothing to install. Draw your layout, click Copy prompt, and paste it into SwarmUI, ComfyUI or Forge Neo. Set the same width and height as in the editor.
Quick start
Set the canvas size, for example 1216 × 832.
Write a short description of the whole image in Scene caption.
Press T for a text box or O for an object box, then drag on the canvas. You can also click + Add.
Type the box's content. For a text box, type the exact words first, press Tab, then describe how they should look.
Copy the prompt, or generate directly if you use the SwarmUI extension.
If you already have a layout from an LLM or from ComfyUI, paste it into the Prompt JSON panel and the boxes appear.
A few things that help along the way: snapping to edges and centers, selecting several boxes to align or space them evenly, undo, saved layouts, and checks that warn you about empty captions, boxes outside the image, or text that is probably too small to render well.
Examples
All three examples are made for 1216 × 832 (3:2 landscape). Use exactly that size when you generate, or the boxes will land in the wrong place. To try one, copy it into the editor's Prompt JSON panel or straight into your prompt.
1. Three characters, a title, and a name under each
A classic case where plain prompts struggle: the names tend to swap or drift. Here each name has its own box, right under its character.
{"summary":{"meta": ["poster", "illustration"], "canvas": "single", "caption": "A painted fantasy movie poster. Three young heroines stand side by side in front of a misty pine forest at dusk, lit by warm lantern light, detailed digital painting with rich colors. A large title runs across the top and each heroine has her name in small capitals below her."},
"items":[
{"label": "text", "caption": "Large golden serif title with a soft glow, centered across the top.", "text": "THE LAST LANTERN", "bbox": [-384, -480, -272, 480]},
{"label": "object", "caption": "A red-haired archer in green leather armor, holding a longbow, confident smile.", "bbox": [-240, -544, 288, -208]},
{"label": "object", "caption": "A dark-skinned mage with long braided silver hair in a deep blue robe, holding a glowing lantern.", "bbox": [-240, -168, 288, 168]},
{"label": "object", "caption": "A young knight with short black hair in polished steel armor, both hands resting on a sword.", "bbox": [-240, 208, 288, 544]},
{"label": "text", "caption": "Small white serif capitals, centered under the archer.", "text": "ELARA", "bbox": [304, -512, 368, -240]},
{"label": "text", "caption": "Small white serif capitals, centered under the mage.", "text": "MIRA", "bbox": [304, -136, 368, 136]},
{"label": "text", "caption": "Small white serif capitals, centered under the knight.", "text": "SOLENNE", "bbox": [304, 240, 368, 512]}
],
"bbox_coord_space":"abs_centralized","bbox_format":"yxyx"}Each name's caption repeats who it belongs to ("under the archer"). That small hint helps keep names and characters paired.
2. A comic strip with speech bubbles
Three panels side by side. Each panel is a large box, the characters and speech bubbles are smaller boxes inside it. Overlapping boxes are fine: a bubble can sit on top of its panel.
{"summary":{"meta": ["comic"], "canvas": "single", "caption": "A three-panel comic strip in a clean, colorful cartoon style with black ink outlines, read from left to right. Two women hear a strange noise at night and discover it was only their cat. Panels are separated by white gutters."}, "items":[ {"label": "object", "caption": "Panel 1: a dark hallway at night, lit by a flashlight beam.", "bbox": [-392, -584, 392, -208]}, {"label": "object", "caption": "A blonde woman with a ponytail in pajamas holding a flashlight, and a brunette woman hiding behind her, both looking worried.", "bbox": [-80, -536, 368, -240]}, {"label": "text", "caption": "White oval speech bubble with a tail pointing down toward the woman, black comic lettering.", "text": "Did you\nhear that?", "bbox": [-360, -560, -208, -248]}, {"label": "object", "caption": "Panel 2: the same hallway, looking up at a closed attic hatch in the ceiling.", "bbox": [-392, -188, 392, 188]}, {"label": "object", "caption": "Close-up of the brunette woman looking up at the hatch, eyes wide, holding his pillow.", "bbox": [-16, -152, 368, 152]}, {"label": "text", "caption": "White oval speech bubble with a tail pointing down toward the brunette woman, black comic lettering.", "text": "It came from\nthe attic...", "bbox": [-360, -156, -208, 156]}, {"label": "object", "caption": "Panel 3: the open attic, warmly lit, with old boxes.", "bbox": [-392, 208, 392, 584]}, {"label": "object", "caption": "An orange cat sitting on top of a cardboard box, looking innocent.", "bbox": [-184, 264, -16, 472]}, {"label": "object", "caption": "The women laughing with relief.", "bbox": [16, 232, 368, 560]}, {"label": "text", "caption": "Small jagged sound-effect bubble near the cat, bold orange letters.", "text": "MEOW!", "bbox": [-296, 424, -216, 568]}, {"label": "text", "caption": "Small white speech bubble with a tail pointing toward the women, black comic lettering.", "text": "Phew.", "bbox": [-360, 240, -296, 416]} ], "bbox_coord_space":"abs_centralized","bbox_format":"yxyx"}The \n in a bubble's text is a line break. Short lines in a roomy bubble render more reliably than one long line in a tight one. Describe the bubble's tail ("pointing toward the girl") to tie each line to its speaker.
3. A magazine cover
A cover has many small parts that each need a place: the title, the issue date, headlines, the price and a barcode. The photo subject gets the right side, and all the text stays on the left so it doesn't cover the hiker.
{"summary":{"meta": ["photo", "magazine cover"], "canvas": "single", "caption": "A landscape-format travel magazine cover. Full-bleed photograph of a lone hiker in a red jacket standing on a rocky ridge above a sea of clouds at sunrise, golden light. Clean, bold magazine typography on the left side, in white with soft shadows."},
"items":[
{"label": "object", "caption": "A lone hiker in a red jacket and grey backpack standing on a rocky ridge, seen from behind, looking at the sunrise.", "bbox": [-272, 72, 352, 472]},
{"label": "text", "caption": "Huge bold white sans-serif masthead, tightly spaced capitals.", "text": "WANDER", "bbox": [-392, -560, -216, 32]},
{"label": "text", "caption": "Small white capitals with wide letter spacing, under the masthead.", "text": "OCTOBER 2026 · ISSUE 42", "bbox": [-208, -560, -168, -80]},
{"label": "text", "caption": "Bold white headline, two lines, left aligned.", "text": "Iceland in\nSeven Days", "bbox": [-112, -560, -16, -80]},
{"label": "text", "caption": "White headline, two lines, left aligned.", "text": "The Last Night Trains\nof Europe", "bbox": [8, -560, 104, -80]},
{"label": "text", "caption": "White headline with a yellow number, two lines, left aligned.", "text": "20 Mountain Huts\nWorth the Climb", "bbox": [128, -560, 224, -80]},
{"label": "object", "caption": "A small white rectangle with a black retail barcode and digits, like on a real magazine.", "bbox": [272, -560, 384, -368]},
{"label": "text", "caption": "Small bold white price text next to the barcode.", "text": "€6.90", "bbox": [328, -352, 376, -208]}
],
"bbox_coord_space":"abs_centralized","bbox_format":"yxyx"}The barcode is an object, not text: you only want something that looks like a barcode, not specific digits. Small items like the price need a box that is big enough for the words, or they come out blurry.
Tips
Match the resolution. The layout is made for one image size. If you change it, change it in the editor too; the boxes keep their relative positions.
Keep text short. A few words per box render much better than a paragraph. Use line breaks rather than long lines.
Give text some room. Boxes that are a little larger than the words work better than tight ones.
Describe the whole image too. The scene caption still matters: style, lighting and mood go there.
Turn off prompt enhancers. In ComfyUI's MOSS-Image layout templates, keep the prompt enhancer off, or it may rewrite your JSON and drop the boxes.
Expect a few tries. Layout control in MOSS-Image is still marked experimental. Keep the seed, adjust a box, and generate again.
Fewer boxes are easier. Up to about a dozen works well; beyond that, results get less reliable.
Try it
Try it in your browser: Layout Editor (standalone). Nothing to install; your layouts stay in your browser.
Source code and SwarmUI install: github.com/jambavant/SwarmUI-LayoutEditor
To install it in SwarmUI, clone the repository into SwarmUI/src/Extensions/, then restart Swarm with a rebuild. The README has the exact steps.
Enjoy!