#!/usr/bin/env python3 """Generate the dithered backgrounds for 0xa0.dev. python tools/background.py all # every style -> img/bg/ python tools/background.py attractor # just one python tools/background.py flow out.png # explicit destination python tools/background.py forest img/bg/forest-2.png 21 # pick a seed All procedural, no source photos. Each is Bayer ordered-dithered to a few grey levels so it matches the terminal aesthetic and stays small. Drop a new PNG into img/bg/ and the site picks it up automatically -- inc/header.php enumerates that directory, so nothing else needs editing. """ import numpy as np from PIL import Image import sys, os W, H = 1400, 875 OUT = 'img/bg' # -- helpers ---------------------------------------------------------- def vnoise(res, seed, w=W, h=H): r = np.random.default_rng(seed).random((res + 1, res + 1)) im = Image.fromarray((r * 255).astype(np.uint8), 'L').resize((w, h), Image.BICUBIC) return np.asarray(im, dtype=np.float64) / 255.0 def fbm(octaves=5, base=3, seed=1, w=W, h=H): o = np.zeros((h, w)); a = 1.0; t = 0.0 for i in range(octaves): o += a * vnoise(base * 2 ** i, seed + i * 101, w, h); t += a; a *= 0.5 return o / t def bayer(n): m = np.array([[0.0]]); s = 1 while s < n: m = np.block([[4 * m, 4 * m + 2], [4 * m + 3, 4 * m + 1]]); s *= 2 return (m + 0.5) / (s * s) def calm(strength=0.55, width=0.32, shape=None): """Damp the middle of the frame, where the text column sits.""" h, w = shape or (H, W) _, xx = np.mgrid[0:h, 0:w] return (1 - strength) + strength * np.clip(np.abs(xx / w - 0.5) / width, 0, 1) ** 1.3 def seg(c, x0, y0, x1, y1, val=1.0): h, w = c.shape n = int(max(abs(x1 - x0), abs(y1 - y0))) + 1 xs = np.linspace(x0, x1, n).astype(int); ys = np.linspace(y0, y1, n).astype(int) ok = (xs >= 0) & (xs < w) & (ys >= 0) & (ys < h) np.add.at(c, (ys[ok], xs[ok]), val) def dither(v, levels=4, mn=4, lo=6, hi=196, mode='bayer'): """Quantise to `levels` greys. mode 'bayer': ordered dither against an n x n Bayer matrix. The matrix size caps how many densities are distinguishable -- 4x4 gives 17 steps, 8x8 gives 65 -- so bigger matrices band far less on smooth gradients at the cost of a finer, less chunky texture. mode 'fs': Floyd-Steinberg error diffusion. No repeating pattern at all, so gradients are smooth and organic, but it loses the woven/print look. """ v = np.clip(v, 0, 1) h, w = v.shape if mode == 'fs': a = v.copy() * (levels - 1) for yy in range(h): for xx in range(w): old = a[yy, xx] new = round(min(max(old, 0), levels - 1)) err = old - new a[yy, xx] = new if xx + 1 < w: a[yy, xx + 1] += err * 7 / 16 if yy + 1 < h: if xx: a[yy + 1, xx - 1] += err * 3 / 16 a[yy + 1, xx] += err * 5 / 16 if xx + 1 < w: a[yy + 1, xx + 1] += err * 1 / 16 out = np.clip(a, 0, levels - 1) / (levels - 1) else: t = bayer(mn); th = np.tile(t, (h // mn + 1, w // mn + 1))[:h, :w] s = v * (levels - 1); low = np.floor(s) out = np.clip(low + (s - low > th), 0, levels - 1) / (levels - 1) g = (lo + out * (hi - lo)).astype(np.uint8) return Image.fromarray(g, 'L').convert('P', palette=Image.ADAPTIVE, colors=levels) # -- styles ----------------------------------------------------------- def flow(seed=29): """Particles advected through a noise vector field; the bright filaments are where the field converges and thousands of paths pile up.""" rng = np.random.default_rng(seed) ang = fbm(4, 3, seed) * np.pi * 3.0 c = np.zeros((H, W)); n = 22000 px = rng.random(n) * W; py = rng.random(n) * H for _ in range(240): a = ang[np.clip(py.astype(int), 0, H - 1), np.clip(px.astype(int), 0, W - 1)] px += np.cos(a) * 1.3; py += np.sin(a) * 1.3 ok = (px >= 0) & (px < W) & (py >= 0) & (py < H) np.add.at(c, (py[ok].astype(int), px[ok].astype(int)), 1.0) return np.clip(c / np.percentile(c, 99.5), 0, 1) ** 0.9 * calm() * 0.92, {} def attractor(a=-1.7, b=1.8, cc=-1.9, d=-0.4, seed=3): """Clifford attractor: x' = sin(a*y) + c*cos(a*x). The bright edges are density caustics where orbits crowd together.""" rng = np.random.default_rng(seed) n = 260000; x = rng.uniform(-2, 2, n); y = rng.uniform(-2, 2, n) c = np.zeros((H, W)) for i in range(70): x, y = np.sin(a * y) + cc * np.cos(a * x), np.sin(b * x) + d * np.cos(b * y) if i > 8: px = ((x + 2.6) / 5.2 * W).astype(int) py = ((y + 2.6) / 5.2 * H).astype(int) ok = (px >= 0) & (px < W) & (py >= 0) & (py < H) np.add.at(c, (py[ok], px[ok]), 1.0) return np.clip(c / np.percentile(c, 99.6), 0, 1) ** 0.75 * 0.95, {} def truchet(cell=46, seed=5): """Quarter-arc maze tiles. Regular and quiet; genuinely tileable.""" c = np.zeros((H, W)); rng = np.random.default_rng(seed) yy, xx = np.mgrid[0:H, 0:W] for gy in range(0, H, cell): for gx in range(0, W, cell): sl = (slice(gy, min(gy + cell, H)), slice(gx, min(gx + cell, W))) ly = yy[sl] - gy; lx = xx[sl] - gx if rng.random() < 0.5: d1 = np.hypot(lx, ly); d2 = np.hypot(lx - cell, ly - cell) else: d1 = np.hypot(lx - cell, ly); d2 = np.hypot(lx, ly - cell) r = cell / 2.0 c[sl] = np.maximum(np.clip(1 - np.abs(d1 - r) / 2.0, 0, 1), np.clip(1 - np.abs(d2 - r) / 2.0, 0, 1)) return c * 0.78, {'levels': 3} def circuit(seed=13, g=16, traces=150): """PCB-style routed traces at 45/90 degrees, with vias.""" c = np.zeros((H, W)); rng = np.random.default_rng(seed) dirs = [(g, 0), (-g, 0), (0, g), (0, -g), (g, g), (-g, g), (g, -g), (-g, -g)] yy, xx = np.mgrid[0:H, 0:W] for _ in range(traces): x, y = int(rng.integers(0, W // g)) * g, int(rng.integers(0, H // g)) * g dx, dy = dirs[int(rng.integers(len(dirs)))] for _ in range(int(rng.integers(8, 30))): nx, ny = x + dx, y + dy if not (0 <= nx < W and 0 <= ny < H): break seg(c, x, y, nx, ny, 1.0); x, y = nx, ny if rng.random() < 0.28: dx, dy = dirs[int(rng.integers(len(dirs)))] if rng.random() < 0.45: c += np.clip(1 - np.abs(np.hypot(xx - x, yy - y) - 3.5) / 1.6, 0, 1) * 0.9 return np.clip(c, 0, 1) * calm(0.5) * 0.72, {'levels': 3} def reaction(seed=9, steps=3800): """Gray-Scott reaction-diffusion. Striking but dense, so it is knocked well back in tone to stay readable behind text.""" gw, gh = 450, 282 U = np.ones((gh, gw)); V = np.zeros((gh, gw)) rng = np.random.default_rng(seed) for _ in range(26): sx, sy = int(rng.integers(12, gw - 12)), int(rng.integers(12, gh - 12)) U[sy - 5:sy + 5, sx - 5:sx + 5] = 0.5 V[sy - 5:sy + 5, sx - 5:sx + 5] = 0.25 Du, Dv, F, k = 0.16, 0.08, 0.0545, 0.062 def lap(Z): return (np.roll(Z, 1, 0) + np.roll(Z, -1, 0) + np.roll(Z, 1, 1) + np.roll(Z, -1, 1) - 4 * Z) for _ in range(steps): uvv = U * V * V U += Du * lap(U) - uvv + F * (1 - U) V += Dv * lap(V) + uvv - (F + k) * V v = np.clip(V / max(V.max(), 1e-6), 0, 1) v = np.asarray(Image.fromarray((v * 255).astype(np.uint8), 'L') .resize((W, H), Image.BICUBIC)) / 255.0 return v ** 1.1 * calm(0.45) * 0.42, {} def ridge(seed=900, lines=40): """Stacked ridgelines, Joy Division style.""" c = np.zeros((H, W)) for i in range(lines): base = H * 0.10 + i * (H * 0.84 / lines) prof = fbm(5, 4, seed + i * 7, w=W, h=8)[0] amp = (H * 0.84 / lines) * 11.0 * (0.25 + 0.75 * np.exp(-((i / lines - 0.5) ** 2) / 0.055)) ys = base - (prof - prof.mean()) * amp for x in range(W - 1): seg(c, x, ys[x], x + 1, ys[x + 1], 1.0) return np.clip(c, 0, 1) * 0.85, {'levels': 3} def topo(seed=11, bands=16): """Iso-contour map of a fractal-noise height field.""" h = fbm(6, 3, seed) d = np.abs((h * bands) % 1.0 - 0.5) return (np.clip(1 - d * 7.0, 0, 1) ** 2.2 * 0.7 + h * 0.12) * calm(0.4), {} def _pine(c, cx, base, h, w, val): """One tiered conifer, drawn as rows of spans so the edges stay blocky.""" fh, fw = c.shape top = int(base - h) rows = np.arange(max(top, 0), min(int(base), fh)) if rows.size == 0: return t = (rows - top) / max(h, 1.0) tier = (t * 3.0) % 1.0 # three stacked skirts hw = w * (0.10 + 0.90 * t) * (0.55 + 0.45 * tier) for r, half in zip(rows, hw): x0 = max(int(cx - half), 0); x1 = min(int(cx + half) + 1, fw) if x1 > x0: c[r, x0:x1] = val def forest(seed=4, layers=4): """1-bit pixel-art conifer forest. Composition follows the knitwear reference: dark starry sky across the top (where the text column sits), a dithered mist band at the horizon, then receding layers of pines. Trees are drawn bright against the dark sky -- each gets a dark outline pass first, so overlapping trees stay separate instead of merging into one white mass. Rendered small and upscaled by CSS with image-rendering: pixelated, so it reads as sprite art rather than a photo. """ fw, fh = 760, 475 rng = np.random.default_rng(seed) v = np.zeros((fh, fw)) y = np.arange(fh)[:, None] / fh ones = np.ones((1, fw)) horizon = 0.66 # stars, denser toward the top of the sky n = 440 sx = rng.integers(0, fw, n) sy = (rng.random(n) ** 2.3 * fh * horizon).astype(int) v[sy, sx] = 1.0 # mist: a narrow glow hugging the horizon, not a wash over the whole # middle. The ordered dither turns this band into the scattered # transition that the knitwear reference has. v = np.maximum(v, np.exp(-((y - horizon) ** 2) / 0.0040) * 0.26 * ones) # receding tree layers, far to near. Each tree gets a slightly larger # dark pass first so overlapping trees stay separate; the outline hugs # the shape rather than overshooting it. for d in range(layers): f = d / max(layers - 1, 1) base = fh * (horizon + 0.02 + 0.34 * f ** 1.2) count = int(120 * (1 - 0.80 * f)) + 8 val = 0.38 + 0.36 * f for _ in range(count): cx = rng.random() * (fw + 140) - 70 hgt = (20 + 74 * f ** 1.3) * (0.72 + 0.56 * rng.random()) wid = hgt * (0.27 + 0.11 * rng.random()) jitter = (rng.random() - 0.5) * 12 * (0.3 + f) _pine(v, cx, base + jitter, hgt * 1.04 + 2, wid * 1.16 + 1.2, 0.0) _pine(v, cx, base + jitter, hgt, wid, val) # a little ground haze at the very bottom for the nearest trees to sit on v = np.maximum(v, np.clip((y - 0.96) / 0.04, 0, 1) * 0.30 * ones) return v, {'levels': 2, 'mn': 8, 'hi': 205} STYLES = {'flow': flow, 'attractor': attractor, 'truchet': truchet, 'circuit': circuit, 'reaction': reaction, 'ridge': ridge, 'topo': topo, 'forest': forest} def render(name, dest=None, seed=None): v, opts = STYLES[name](seed=seed) if seed is not None else STYLES[name]() img = dither(v, **{**{'levels': 4, 'mn': 4}, **opts}) dest = dest or os.path.join(OUT, name + '.png') os.makedirs(os.path.dirname(dest) or '.', exist_ok=True) img.save(dest, optimize=True) a = np.asarray(img.convert('L')) print(" %-10s -> %-22s %3dKB mean=%.0f" % (name, dest, os.path.getsize(dest) // 1024, a.mean())) if __name__ == '__main__': what = sys.argv[1] if len(sys.argv) > 1 else 'all' if what == 'all': for n in STYLES: render(n) else: dest = sys.argv[2] if len(sys.argv) > 2 else None seed = int(sys.argv[3]) if len(sys.argv) > 3 else None render(what, dest, seed)