---

name: illustration-vintage-emblem description: Draws original hand-authored SVG badge illustrations in a vintage emblem style for design and coding subjects. Identifying traits: a seven-colour screen-print palette (green-black ink, cream, terracotta, sand, tan, pale, a touch of teal) with no gradients; one chunky hero object in thick 3.6 px ink outlines, shaded with woodcut gouges and lit with pale streaks; a terracotta sun disc behind it, cut free by a 7.5 px cream keyline; a hard horizontal edge slicing the scene into a dark splash band with cream droplets punched out; a heavy condensed wordmark over a letterspaced serif tagline. Covers lockups, hero objects, gulls, splash bands and lettering. Use when someone asks for a vintage emblem, retro badge, crest, logo-style, screen-print, poster, sticker, patch or merch-style illustration, or a badge card for a team, event, release, empty state, 404 page, blog header or marketing card.

Illustration: Vintage emblem

A screen-printed badge on cream paper: one bold object on a sun disc, a splash of ink along a hard bottom edge, and a heavy condensed wordmark with a small serif tagline. It suits named things (a club, a release, a principle, a team ritual) where the words are part of the picture. Use illustration-two-colour-brush instead for loose brush-painted scenes in two inks; illustration-teal-spot for a single-colour spot object with no lettering; illustration-flat-with-black for a flat character scene with solid black shapes.

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

One chunky object, outlined in thick green-black ink and shaded with carved ink wedges, stands on a terracotta sun disc that a 7.5 px cream keyline cuts it free from, while a hard horizontal edge slices the scene into a dark splash band with cream droplets punched out, all locked up over a heavy condensed wordmark.

Palette

Measured from the examples. Seven flat colours, nothing else.

| Role | Hex | Where it goes | |---|---|---| | Card | #f8f0e3 | full-bleed background (78–85 % of the rendered card), keyline, cream highlights, droplets cut into the ink, the billow | | Ink | #1f2b25 | outlines, shadow wedges, splash band, gulls, wordmark, tagline (45–51 % of all non-cream pixels, wordmark included) | | Terracotta | #c8693f | the sun disc; one repeat on the subject (nose cone, beetle shell, porthole ring, flame) | | Sand | #d9a873 | main fill of the subject (fins, crown, lens rim, flame core) | | Tan | #b5824f | darker fill: trunks, grips, the shaded tone under sand | | Pale | #ecd2a8 | highlight streaks, rock faces, glass | | Teal | #3f8273 | accent only: one band, ring, collar or set of node dots per card, 2–4 % of non-cream pixels |

• Never: gradients, opacity, textures, hatching, filters, pure black or white, a sixth hue.
• Terracotta never touches the sun: anything terracotta on the subject sits inside the keyline.
• Teal never fills a large shape; a teal fin set was cut from the first card.

Line and fill

All numbers are in lockup units (the lockup is scaled 0.95–0.97, so on the card they come out about 4 % smaller).

• Subject outlines: 3.6 ink strokes, stroke-linejoin="round" (OUT in the kit). Small inner parts 2.2–2.8 (nozzle, collar, porthole ring 2.0).
• Union outlines: shapes that read as one mass (trunk + roots, a cluster of puffs) get one outline: an ink underlay stroked at 7.2 (2 × OUT), then the fills (unionOutline).
• Keyline: the subject's silhouette shapes again, filled and stroked cream at 15 (a 7.5 px cream gap), drawn after the sun and before the subject. Include every lobe, handle and spike, or the subject melts into the disc.
• Shade is ink cut into colour, on the right/lower side (light from the upper left):
  • woodcut gouges: wedge() 1.8–4.2 wide (10 on a trunk), blunt base, sharp tip;
  • crescents inside round parts (crescent(), thickness 2–4.2);
  • a two-tone offset for puffy masses: tan underneath, sand shifted (−2.6, −7.6) on top, so tan shows as a lower-right crescent (puffs()).
• Light is pale or cream streaks on the upper left: streak() half-width 1–2.4, both ends sharp; 2–5 per object. Short round-capped pale strokes (1.8–3.6) are fine on narrow parts.
• Flat fills only. No outline on the gulls, splash, droplets or wordmark (the wordmark uses a 2.2 same-colour stroke only to round its corners).

Characters

No people. The hero object is the character:

• One hero, chunky and nearly symmetric, 80–210 px wide, built from 3–8 big shapes. Secondary structures compete with it: a launch tower beside the rocket was cut.
• It breaks the sun's circle: the rocket's nose rises above the disc, the tree crown is wider than the disc, the magnifier sits left so the disc shows as a crescent.
• Each big shape: flat fill, 3.6 outline, one ink shadow shape or 1–3 gouges on the right, 1–3 pale streaks on the left.
• Detail is carved, not drawn: rivets as ink dots r 1.15, grain as gouges, a code glyph </> in cream strokes 2.4 inside a porthole.
• Coding cues live inside the object (a </> porthole, roots laid out as a git graph with cream-and-teal nodes, a beetle under a lens) or in the splash (curly braces and chevrons as ink strokes 5.2–5.4).
• Creatures are cut like woodcuts: ink head and legs (tapered tubes with round joints), coloured shell with ink striae and pale streaks.
• Round objects (lens, dial, porthole, wheel), the Debug Club recipe: a sand ring outlined 3.6; inside a clip of the ring, a tan ring offset (+2.4, +2.4), an ink crescent on the right (thickness 4–4.6) and 5–6 short gouges on the right; a cream arc highlight on the upper left of the ring (stroke 2.6, two dashes); then the glass or dial in pale outlined 3.6, with a sand ring offset (+6, +6) and cream streaks on the upper left, all clipped to the glass.
• Small parts that stick out of a round object (crown, pushers, handle collar) are stadiums or quads standing on its rim, sand or tan, each outlined 3.6 and each in the keyline.

Decor and props

• Gulls: 2–4 ink "m" silhouettes (gull(x, y, s), s 7–10.5), in the sky beside or above the disc, never overlapping the subject, sizes varied, one mirrored.
• Splash band along the crop (foam()): an ink band from x 96–100 to 380–384, rising to a crest near y 216–224, 5 lobes a side (r 6.5–13.7, mirrored about x 240); cream holes r 1–3.2 punched into the dark (8–15 of them), teardrop drops r 1.8–3.2 flung outward at ±48–72°, 4–6 loose specks r 1–1.5.
• Centre of the band is the subject's base and changes per card: a cream cloud billow with ink lobes behind (rocket), a dark knoll with pale boulders and grass tufts (tree), ink spikes with drop tips (magnifier). A cloud bank is ONE outlined mass shaped like a mound, tallest under the hero: puffs(list, { merge: true, dark: PALE, light: CREAM }); draw part of it after the hero so the hero sits in it.
• Optional ink flecks: tiny triangle chips, grass blades as wedge() tufts.
• Never: stars, sparkles, frames, ribbons, banners, circles of text, dates, a second sun or moon.

Composition

• Card: full-bleed <rect width="480" height="360" fill="#f8f0e3">, square corners.
• Emblem: sun disc r 86–88 at (240, 114–118); the scene clipped by <clipPath><rect width="480" height="229"/></clipPath> so everything ends on one hard horizontal edge at y 229. Emblem 276–328 px wide, about 205 px tall.
• Wordmark: top at y 258–260, centred on x 240, scale 0.68–0.95, cap 38–53 lockup units (the CLI prints it), 190–310 px wide on the card. Words of 12+ letters need --max-width 320 (or wmMaxWidth: 320 in card()) to keep the cap at 38. Tagline baseline = wordmark top + cap + 19.
• Lockup: everything in <g transform="translate(240 180) scale(0.95–0.97) translate(-240 -cy)"> with cy = (top of the emblem + tagline baseline) / 2, so the whole badge is centred. Shipped lockups span y 30–331 (84 % of the card height).
• One focal point, dead centre, symmetric weight; the sky stays clean except gulls.

Techniques

Two helpers in scripts/, no dependencies. From the skill folder:

• node scripts/wordmark.mjs "RELEASE DAY" --tagline "TAG • SHIP • REST" --prefix rd- prints the wordmark <g>, the tagline <text> and the lockup numbers. A–Z, 0–9 and - . ! '. --max-width 280 (default) sets the scale; node scripts/wordmark.mjs --sheet alphabet.svg renders every glyph. It reproduces the shipped OPEN SOURCE and DEBUG CLUB wordmarks exactly.
• node scripts/emblem-kit.mjs demo.svg writes a self-test card. card() builds the whole SVG shell (card, crop, sun, keyline, lockup centring, wordmark, tagline). When the hero rises above the sun (a rocket nose, a bow), pass top: its highest y, or the lockup centres on the sun and sits low.

import * as K from '/abs/path/to/illustration-vintage-emblem/scripts/emblem-kit.mjs';
const P = 'rd-', fo = K.foam();                       // the Debug Club band; pass lobes/holes/flung to vary it
const body = 'M210 60 L270 60 L270 200 L210 200Z';     // your hero's silhouette paths
const svg = K.card({ prefix: P, label: 'Release Day', word: 'RELEASE DAY', tag: 'TAG • SHIP • REST',
  keyline: `<path d="${body}"/>` + fo.keyline,          // silhouettes: cream, stroked 15
  emblem: `<g fill="${K.INK}"><path d="${K.gull(150, 60, 9)}"/></g>
    ${K.outlined(body, K.SAND)}
    <path d="${K.wedge(262, 196, 258, 90, 4, 0)}" fill="${K.INK}"/>
    <path d="${K.streak(218, 80, 220, 150, 2, 0)}" fill="${K.PALE}"/>
    <g fill="${K.INK}">${fo.ink}</g><g fill="${K.CREAM}">${fo.holes}</g>` });

A cloud bank the hero sits in: back puffs, hero, front puffs, each set under one outline; every puff also goes in the keyline.

const rnd = K.rng(23);
const back = [K.puff(190, 206, 30, 12, 9.5, rnd), K.puff(292, 206, 30, 12, 9.5, rnd)];
const front = [K.puff(240, 214, 36, 17, 11.5, rnd), K.puff(196, 222, 26, 11, 9.5, rnd), K.puff(284, 222, 26, 11, 9.5, rnd)];
const pb = K.puffs(back, { prefix: P + 'b', dark: K.PALE, light: K.CREAM, merge: true });
const pf = K.puffs(front, { prefix: P + 'f', dark: K.PALE, light: K.CREAM, merge: true });
// defs: pb.defs + pf.defs; keyline: [...back, ...front].map(c => K.puffShape(c, K.OUT)).join('')
// emblem: splash, pb.svg, hero, pf.svg

Carving inside a shape, clipped so gouges never cross the outline (as the rocket body and beetle shell do):

<clipPath id="rd-bodyclip"><path d="M…body…"/></clipPath>
<g clip-path="url(#rd-bodyclip)">
  <path d="M243 55 C244 66 243 78 242 88 … L262 146 V55Z" fill="#1f2b25"/>   <!-- shadow side -->
  <path d="M245.6 86 C246.6 96 … Z" fill="#d9a873"/>                         <!-- reflected light in it -->
</g>
<path d="M…body…" fill="none" stroke="#1f2b25" stroke-width="4.2" stroke-linejoin="round"/>  <!-- outline last -->

Failure modes

• Hero lost among props. A launch tower beside the rocket split the focus; one hero only.
• Teal everywhere. Teal fins made the badge read as a different palette; keep teal to one band or ring.
• Busy base. A row of separately outlined cloud puffs looked like bubble wrap (the self-test hit this again with puffs() defaults); use one merged cream billow (merge: true) in the centre and ink lobes with punched holes at the sides.
• Flat cloud sausage. Equal-height puffs in a row read as a bolster; make the bank a mound, tallest under the hero.
• Wordmark too small. A 13-letter word at the default width came out with a 33-unit cap; widen to --max-width 320 before shortening the words.
• Crown reads as balls or a mushroom. Plain circles for foliage; build clumps from bump rings with ink curls under the top bumps, gouges up from the bottom and the two-tone offset (puffs()).
• Roots or lines read as scribble. Free diagonal shapes; lay them out as lanes with vertical tangents (gstep), like