How this site is woven

The idea

Computing descends from the loom: Jacquard’s punched cards programmed silk before they programmed Babbage’s engine. So the site is a loom. The layout grid is drawn as warp threads you can pluck; services are dyed weft threads that pass over and under them; every project gets a cloth woven from its own seed.

The mark

Our mark is tānā-bānā: two warp threads and two weft threads in plain weave, each passing over one and under the other: the smallest piece of cloth that holds together. Drawn, it is a #, the oldest sign in a programmer’s alphabet. Tānā-bānā is also the Hindi idiom for the very fabric of a thing, and where our name begins. In the wordmark, the “oo” of loom is interlaced the same way: one loop over, then under, the other.

Type

• Newsreader by Production Type: an editorial serif, in a single weight with its italic, so headlines arrive fast.
• Schibsted Grotesk: a precise, slightly warm grotesque for everything you read and click.
• IBM Plex Mono sets the annotations. IBM’s punched-card machines are part of the same lineage as Jacquard’s loom.
• Hind and Hind Vadodara by the Indian Type Foundry, for Hindi and Gujarati. They set only a few words, so they load after everything else.

All are open-source, self-hosted and subset, so no request ever leaves for a font service. While a font loads, a fallback with matched metrics stands in, so nothing on the page moves when it arrives.

Color

The palette comes from natural dyes used in Gujarat’s textile traditions.

The loom

The hero loom and the page’s warp are drawn on a canvas with a small physics engine of our own: each thread is a string of points under tension, solved with Verlet integration. It follows the real motions of a hand loom: shed, pick, beat-up, take-up. It sleeps when nothing moves, pauses off-screen, respects reduced motion, and is hidden from screen readers because it is decoration, not content.

Hidden threads

Type jacquard anywhere on the site and it turns to the monochrome of a punched card, like the programs that drove Jacquard’s loom in 1804. Type it again to bring the colour back.

●○●●○Toggle Jacquard mode

Turn on Sound in the footer and the warp threads ring when you pluck them. Each thread is synthesised with the Karplus-Strong algorithm (a burst of noise circling a short, slowly damped delay line) and tuned to Raga Bhupali (Sa Re Ga Pa Dha), a pentatonic scale, so any sweep across the warp is in tune. It stays off unless you turn it on.

Between pages, the content is woven in behind a shuttle pass, and like a real shuttle it changes direction every time.

Stack

• Next.js with React Server Components, statically generated and served from Vercel’s edge
• TypeScript, Tailwind CSS and design tokens
• PostgreSQL with Prisma for the enquiries you send us
• Cloudflare Turnstile instead of CAPTCHAs; cookieless analytics
• Vitest and Playwright with axe-core on every change

Budgets

We hold this site to the same budgets we promise clients:

• Largest Contentful Paint under 2 seconds on a mid-range phone
• No layout shift, no preloader, no scroll-jacking
• WCAG 2.2 AA, with every page readable without JavaScript
• No tracking cookies and no third-party fonts