Illustrations
Illustrations support a tool or article without explaining it. They give a card a visual register after its heading and summary have already named the subject. If position, connection, quantity or a label in the picture has to be understood, use a diagram instead.
That separation also makes an illustration safe to crop or reduce: the copy still carries the subject when a decorative edge leaves the frame. A diagram cannot make the same trade, because its positions and labels are the claim.
An illustration occupies an explicit media slot. It is never a page ground behind text: page surfaces stay flat, and keeping the picture inside its own frame makes clear where decoration ends and content begins.
The language#
- One person, object or still-life gesture, reduced to five to eight broad, hard-edged silhouettes.
- A flattened, almost orthographic view. Use overlap and at most two flat tones per object instead of realistic perspective, materials or lighting.
- Near-black charcoal, warm greys and muted taupes on a quiet, nearly neutral warm-white ground.
- One contained field of regular halftone dots and exactly one small
#FF8700detail. Neither carries explanatory meaning. - No text, labels, arrows, charts, workflows, code or UI screens.
Every illustration is a 1200 × 750 PNG with crop-safe space around its subject. The same file is used unchanged in light and dark mode. Its warm-white ground is the canvas of the image, not an attempt to merge into the page around it. A separate dark rendering would duplicate a decorative asset and let its composition drift even though the bitmap already carries the ground it needs.
The set#
Drawing another one#
The rules above with the generator's own vocabulary around them — the medium,
the negative constraints and how a subject is chosen. It is here in full
rather than behind a link because it is handed over rather than read: copy the
whole block and replace [SUBJECT], which is the one field that changes.
Rewriting the medium or the rendering language starts a second style, and a
set in two styles is no longer a set.
The prompt deliberately carries no register of subjects already drawn.
packages/frontend/assets/placeholders/ owns that list; copying it into a
prompt would turn the instructions for the next image into an inventory that
can quietly fall behind the assets.
# Editorial spot-colour illustrations
These illustrations give a tool or an article a visual register without
explaining it. A diagram carries a claim; an illustration only supports the
subject already named by the adjacent heading and summary. If position,
connection or quantity in the image has to be understood, draw a diagram
instead.
## The fixed language
- **Format:** 1200 × 750 PNG. One file is used unchanged in light and dark
mode; there is no mode pair.
- **Composition:** one person, object or still-life gesture, drawn as five to
eight large silhouettes in a flattened, almost orthographic view. Leave
generous, crop-safe space around it.
- **Colour:** quiet, nearly neutral warm-white ground, near-black charcoal, warm greys and
taupes, plus exactly one small `#FF8700` detail. No second accent.
- **Form:** broad, hard-edged matte planes with deliberately simplified
proportions. A sparse dark line may describe a cable, edge or joint, but
never a relationship or process.
- **Texture:** one regular halftone field in one contained plane. It is the
print texture of the illustration, not the dashed-state vocabulary of a
diagram.
- **Depth:** use overlap and at most two flat tones per object. One pale,
shape-like ground wash is allowed; realistic cast shadows, highlights,
materials and continuous modelling are not. The wash does not license a
CSS shadow, elevation or another interface gradient; the linked card's lit
frame remains the only one.
- **People:** adult proportions, quiet posture, no identifiable facial detail.
- **Accessibility:** the files are decorative support. Use an empty `alt`
when the adjacent copy already names the subject.
## Prompt
Replace `[SUBJECT]` and leave the rest unchanged:
```text
Use case: stylized-concept
Asset type: decorative card illustration, wide 8:5 landscape
Primary request: Create a mature editorial spot-colour illustration of
[SUBJECT] for a restrained technical design system.
Style/medium: flat drawn editorial illustration with a restrained
cut-paper/printmaking character; broad hard-edged matte silhouettes;
deliberately simplified geometry; at most two flat tones per object; one
controlled field of regular vintage halftone dots.
Composition/framing: 1200 × 750; one clear subject or still-life gesture;
flattened, almost orthographic view with very shallow perspective; generous
nearly neutral warm-white negative space matching #F7F6F2; crop-safe on all
sides; readable at card size; no border or frame.
Colour palette: warm off-white, near-black charcoal, warm grey, muted taupe,
and exactly one small vivid orange #FF8700 element. No other hue.
Rendering rules: five to eight dominant silhouettes; clean simplified
contours; no small functional detail. A sparse line may describe a cable,
edge or joint but must not form a process or diagram. Put the halftone inside
one contained object plane only. If grounding is needed, use one pale flat
wash shaped like a shadow, never realistic lighting.
Constraints: decorative, not explanatory; no text, letters, numbers, logos,
watermark, labels, arrows, charts, workflows, code or UI screens.
Avoid: photorealism, product rendering, realistic perspective, realistic
materials, lenses, reflections, highlights, continuous shading, cast-shadow
gradients, paper grain, cream or parchment backgrounds, bright multicolour
palettes, dramatic lighting, glossy 3D, childish character design, retro
travel posters, speech bubbles, dense detail, fine hatching and decorative
clutter.
```
## Choosing the subject
One concrete thing, taken from what the heading beside it already names: an
object, or a person handling an object. The copy carries the subject, and the
image only sets a register beside it, so the thing itself is enough and the
idea behind it is not wanted.
Draw it at rest rather than at work. A drawer with no cards in it, an
unwritten sheet, one module outside its socket — the moment before or after
the work reads as an object, where the work itself needs position, sequence
and quantity, and that is a diagram.
Which subjects a set has spent is a property of that set, not of this prompt.
It produces one image and knows nothing of the others; a view that shows
several cards at once is assembled by someone who can see all of them.
The illustration prompt — replace only the subject
markdown
# Editorial spot-colour illustrations
These illustrations give a tool or an article a visual register without
explaining it. A diagram carries a claim; an illustration only supports the
subject already named by the adjacent heading and summary. If position,
connection or quantity in the image has to be understood, draw a diagram
instead.
## The fixed language
- **Format:** 1200 × 750 PNG. One file is used unchanged in light and dark
mode; there is no mode pair.
- **Composition:** one person, object or still-life gesture, drawn as five to
eight large silhouettes in a flattened, almost orthographic view. Leave
generous, crop-safe space around it.
- **Colour:** quiet, nearly neutral warm-white ground, near-black charcoal, warm greys and
taupes, plus exactly one small `#FF8700` detail. No second accent.
- **Form:** broad, hard-edged matte planes with deliberately simplified
proportions. A sparse dark line may describe a cable, edge or joint, but
never a relationship or process.
- **Texture:** one regular halftone field in one contained plane. It is the
print texture of the illustration, not the dashed-state vocabulary of a
diagram.
- **Depth:** use overlap and at most two flat tones per object. One pale,
shape-like ground wash is allowed; realistic cast shadows, highlights,
materials and continuous modelling are not. The wash does not license a
CSS shadow, elevation or another interface gradient; the linked card's lit
frame remains the only one.
- **People:** adult proportions, quiet posture, no identifiable facial detail.
- **Accessibility:** the files are decorative support. Use an empty `alt`
when the adjacent copy already names the subject.
## Prompt
Replace `[SUBJECT]` and leave the rest unchanged:
```text
Use case: stylized-concept
Asset type: decorative card illustration, wide 8:5 landscape
Primary request: Create a mature editorial spot-colour illustration of
[SUBJECT] for a restrained technical design system.
Style/medium: flat drawn editorial illustration with a restrained
cut-paper/printmaking character; broad hard-edged matte silhouettes;
deliberately simplified geometry; at most two flat tones per object; one
controlled field of regular vintage halftone dots.
Composition/framing: 1200 × 750; one clear subject or still-life gesture;
flattened, almost orthographic view with very shallow perspective; generous
nearly neutral warm-white negative space matching #F7F6F2; crop-safe on all
sides; readable at card size; no border or frame.
Colour palette: warm off-white, near-black charcoal, warm grey, muted taupe,
and exactly one small vivid orange #FF8700 element. No other hue.
Rendering rules: five to eight dominant silhouettes; clean simplified
contours; no small functional detail. A sparse line may describe a cable,
edge or joint but must not form a process or diagram. Put the halftone inside
one contained object plane only. If grounding is needed, use one pale flat
wash shaped like a shadow, never realistic lighting.
Constraints: decorative, not explanatory; no text, letters, numbers, logos,
watermark, labels, arrows, charts, workflows, code or UI screens.
Avoid: photorealism, product rendering, realistic perspective, realistic
materials, lenses, reflections, highlights, continuous shading, cast-shadow
gradients, paper grain, cream or parchment backgrounds, bright multicolour
palettes, dramatic lighting, glossy 3D, childish character design, retro
travel posters, speech bubbles, dense detail, fine hatching and decorative
clutter.
```
## Choosing the subject
One concrete thing, taken from what the heading beside it already names: an
object, or a person handling an object. The copy carries the subject, and the
image only sets a register beside it, so the thing itself is enough and the
idea behind it is not wanted.
Draw it at rest rather than at work. A drawer with no cards in it, an
unwritten sheet, one module outside its socket — the moment before or after
the work reads as an object, where the work itself needs position, sequence
and quantity, and that is a diagram.
Which subjects a set has spent is a property of that set, not of this prompt.
It produces one image and knows nothing of the others; a view that shows
several cards at once is assembled by someone who can see all of them.