Illustration Two Colour Brush

Illustration: Two-colour brush

Loose, confident marker drawings in two inks, black and mint, on cream paper. A chunky character does one readable thing, drawn with fat wobbly lines; mint sits in flat blocks that never quite line up with the black. It suits playful product moments that want energy and a human hand: empty states, onboarding, error pages, editorial headers.

Boundary: for a wobbly brush line with hatching and full colour, use illustration-ink-sketch. For a single continuous line with off-register colour, use illustration-one-line. For thin black line with halftone dot shading, use illustration-halftone-line. For flat colour with solid black shapes and no marker texture, use illustration-flat-with-black.

Extracted from a set of 42 original design-and-coding cards in 14 styles; the three cards in examples/ are this style's shipped cards.

The look in one sentence

Every line is a fat, wobbling, blob-ended black marker ribbon, and the only other ink is flat mint green laid as a second plate that slips a few pixels off those lines, on cream paper.

If the lines go even-width or the mint registers exactly inside the outlines, it stops being this style.

Palette

Four colours, measured from the examples. Nothing else is ever drawn.

Never: a third hue, grey, tints or opacity, gradients, filters, drop shadows, or stroke= lines (the only stroked paths are paper halos). Skin is paper, not a skin tone. Mint never touches mint: separate two mint areas with a black line or paper.

Line and fill

• Every line is a filled ribbon from scripts/brush.mjs, never an SVG stroke. On the 480 card the nominal width w renders at w x 1.42 (w >= 4), w x 1.28 (3.3-3.9) or w x 1.1 (below 3.3), whatever the fit scale.
• Widths in use (card px): floor line w 5.2-5.8 (7.4-8.2); big silhouettes (duck, armchair, hair) w 4.4-4.8 (6.2-6.8); standard outlines (body, limbs, props) w 4.0-4.2 (5.7-6.0); hands, mugs, small props w 3.0-3.8 (3.3-4.9); inner lines, glyphs, creases, tread w 2.0-2.8 (2.2-3.1); camo w 2.5-2.8.
• Wobble: width varies ±34% along a stroke, the start blob swells 38-78% and the end 26-66%, long strokes get 1-3 swells, and the centre-line wanders 0.95 px. Keep the defaults; pass v: 0.05-0.15 only for small glyphs and clock hands.
• Outlines of closed shapes are ONE loop() stroke that starts somewhere (start 0-1) and overlaps its own start by 4%. A visible overlap blob is correct. part: 0.93 leaves a deliberate gap.
• Solid black shapes (hair, trousers, shoes, hoodie): fillShape(ink) then a loop() outline round them, so the edge is lumpy.
• The mint plate: fill the shape with paper or off-white, then the SAME shape in mint shifted by (dx, dy), then the black outline. Offsets on the examples run from 2 to 10 px, mostly up-left (-3..-7, -2..-6), a few down-right. On black shapes, put the shifted mint BEFORE the black fill so mint peeks out along one edge.
• Halos: where a front object crosses a black shape, lay halo(shape, 3-12) first: a paper fill plus paper stroke that cuts a clean gap. Shoes 10-11, a front leg 8.5, a laptop lid 6-8, hair 9, arms 6, palms 5, thumbs 3.
• Highlights: 2-4 mint dashes (w 2.4-3.0, 8-16 long) along the inside edge of each black shape, 4-5 in from the outline; off-white dashes (w 2.4-3.0) for glints on shoes, mugs and lids.
• Squiggle camo on off-white areas only: 3-7 crinkled wandering lines, 1-3 closed puddles and 1-4 small o-rings (r 3.4-4.2) per area, w 2.5-2.8, clipped to the shape with clipped(), drawn before the outline.
• Stipple: clusters of 3-5 dots r 1.0-1.5 in ink or mint beside a form (a cushion, a cheek, a belly).

Characters

• Proportions: chunky. The head with hair is about 1/3.5 of a seated figure's height; limbs are fat tubes (legs 38 → 23 wide, arms 30 → 24, in scene units before fit); hands about as long as the face; shoes about as long as the head is wide.
• Head: profile or 3/4, facing the action. Paper fill; the outline runs only down the face side as two open strokes (forehead → big bulbous nose → upper lip, then chin → jaw), w 4.0. The nose sticks out about 15 units and is the largest feature. profileHead(x, y, { deg, scale, facing, hair, eye, mouth }) in scripts/brush.mjs draws the set's head with a neck block: hair curly | bun | ponytail, eye open | shut (straining) | tired, mouth smile | talk | teeth | flat; facing: -1 mirrors it. Scale 1.1-1.3.
• Hair: a lumpy black blob of 20-26 control points with a loop() outline (w 4.0) and 2-4 short mint dashes inside. Curly hair, buns and beards are all solid black.
• Face: a dot eye r 3.6-3.9 (ink) with an off-white glint r 1.0 up and toward the nose; a brow arc w 3.0-3.2 above; an ear (paper fill, C-stroke w 3.4, inner curl w 2.8); a smile or flat mouth w 3.0-3.4. Tired: a heavy lid stroke plus a bag line w 2.4.
• Neck: a paper block with one side line w 3.2-3.4.
• Clothing: off-white shirts and sweaters carry camo; trousers and hoodies are solid black with mint dashes; cuffs are mint tubes or a single stroke across the wrist.
• Hands, open: openHand() with five tapered fingers of different lengths, from local angles thumb -58°, index -14°, middle -3° (longest, 23), ring 9-10°, little 24-25° (shortest, 15); a paper fill plus one open outline w 3.2-4.0; a short tapered palm crease w 2.6. The thumb leaves the palm near the wrist at about 45°.
• Hands, gripping: a paper palm block (loop w 3.0-3.2), separate finger tubes 7.4 → 6.6 wide and 14-18 long with round ends, about 7.5 apart, laid across the object (each its own loop() w 2.6), and a thumb tube 9 → 7 closing over from the other face, with a 3 px halo. A block hand can instead show three finger-separation dashes (w 2.0) from the edge inward. fist(x, y, deg, { thumb: 'top' | 'bottom' }) draws the back-of-hand fist round a bar or rope (knuckles along deg, the forearm direction). A far hand behind the bar shows only a palm block plus three fingertip tubes curling over the bar's front. Put every thumb where references/craft.md handedness says, and run the thumb proof.
• Feet: big shoes: black upper, off-white toe cap, a mint sole plate offset 1.5-2.5, three tread strokes (w 2.4), two off-white lace dashes. Cross-legged figures show the soles. Slippers are mint with an off-white rim. shoe(ankle, deg, scale, facing) draws the shoe; a negative deg (-25 to -30) tips the toe up for a heel dug into the floor.
• Poses that work: sitting cross-legged on a cushion talking with one big open hand (Rubber Ducking); striding in profile with a lean, one arm steadying a load (Coffee-Driven); slumped in an armchair with a laptop on the lap and a mug raised (Night Owl). Hauling (the self-test's Deadline): the body is one straight line from the front heel to the head at about 35° off vertical, both heels dug in with the toes up, arms straight to two fists at waist height on a taut rope, the far fist at least 15 units in front of the chest line so its forearm shows.

Decor and props

• Emphasis ticks: 4 marker strokes (w 4.0-4.2, 9-14 long) fanned from -150° to -55° round the head, 44-62 units from its centre. Over a black shape, lay a paper underlay first.
• Accents: a speech bubble (off-white, loop w 4.2) with {…} or !; ?! marks; 3 speed lines (w 3.6-4.0, 40-54 long); 2 steam squiggles (w 3.0, 4 points); 4-point stars (off-white or mint) only inside a night window.
• Props: laptop (off-white or black lid, mint </> sticker, key dashes), mugs and takeaway cups (black or off-white with mint), rubber duck, floor cushion, armchair with camo upholstery, window with a mint moon, wall clock, plug and coiled cable.
• Per card: one figure, 1-3 big props, 2-4 small accents. Never a background shape, a frame, confetti, logos, or text beyond code glyphs (</>, {…}, !, ?).

Composition

• Card: <rect id="p-paper" width="480" height="360" fill="#f1ede3"/>, then one <g id="p-art"> holding the fitted scene.
• Size: build() fits the control-point bounding box into 392 x 278 centred on (240, 184): the art spans about x 44-436 and y 45-323, so margins are about 44 px left and right, 45 top, 37 bottom. build() prints the fit scale S: the figure should land 200-250 px tall on the card (its height in scene units x S). A prop parked at the far edge widens the box and shrinks everything; in the self-test a laptop on the floor pushed S to 0.91 and the figure went small. Move or drop it.
• Ground: one or two black floor strokes (w 5.2-5.8) under the feet, often with a mint band (w 8.5) or a mint rug plate under them. Every foot, chair leg and object touches it.
• Focal point: the face and the gesturing hand, in the upper-middle third; the joke or prop sits beside it, never behind it.
• Density: sparse. Leave the paper open around the group; one cluster of marks, not an all-over pattern.