Colophon
History§
- siddhantsci.org, 2012 to 2016. Octopress, then Pelican.
- sidcode.github.io and cyber-physical.space, 2019 to 2023. Pelican, with Eric Lawler’s theme based on Dave Liepmann’s Tufte CSS.
- This version, October 2026. Rebuilt from scratch. Old letters kept their URLs.
The old site’s to-do list asked for popups, sidenotes and citations, and aimed at being “a cheap ripoff of gwern.net”. Took me more than a decade but now we here.
How it’s built§
- A static site generator written in TypeScript and run with Bun. It’s about 2,500 lines of build code, 2,500 of browser code and 3,000 of CSS, and lives in the repo with the writing.
- Markdown is processed with unified (remark and rehype). Code highlighting (Shiki) and maths (KaTeX) happen at build time, so neither needs JavaScript in the browser.
- The research diary is built with Quartz by Jacky Zhao and contributors, restyled to match the rest of the site.
- Interactive parts are custom elements. A letter can include
<game-of-life>in its markdown and the build adds the script. - Hosted on GitHub Pages and built with GitHub Actions. Third-party actions are pinned to specific commits.
Writing workflow§
bun run new "A title" # starts a draft in the private drafts repo
bun run dev --drafts # preview at localhost:4321
bun run publish drafts/letters/2026/a-title.md
git commit -am "New letter" && git push # GitHub builds and publishes itMarkdown extras: footnotes become sidenotes, > [!note] makes a callout, :::from[2040] makes a note from another year, ::youtube{id=...} embeds a video that loads only when played, and [[wiki links]] link to diary notes.
Reading features§
Most of these are adapted from gwern.net:
- Sidenotes. Footnotes appear in the right margin when there is room, and as popups otherwise.
- Link previews. Hovering a link to another page on this site, a Wikipedia article or one of my papers shows a preview. Links with a dotted underline have one.
- Link icons show where a link goes: W for Wikipedia, χ for arXiv, a play symbol for video.
- Reader mode hides everything except the text. Hold Alt to see links.
- Reading settings (the Aa button): light, dark or sepia, high contrast, five typefaces including Atkinson Hyperlegible and OpenDyslexic, text size, line spacing, letter spacing, line length and motion. The settings also apply to the diary.
- Keyboard shortcuts: press ? for the list. They can be turned off in settings.
Privacy§
No analytics, cookies, trackers or ads. Reading settings are stored in your browser’s local storage and are not sent anywhere.
Two features contact other sites, and only when you use them:
- Videos load from youtube-nocookie.com or Vimeo when you press play. Thumbnails are served from this site.
- Wikipedia previews fetch a summary from wikipedia.org when you hover a Wikipedia link. Turning off link previews in settings stops this.
Everything else, including fonts, is served from this site.
Accessibility§
The target is WCAG 2.2 AA: text contrast of at least 4.5:1 in every theme, visible focus outlines, a skip link, labelled controls, alt text, and reduced motion when your system requests it. If something doesn’t work for you, please let me know.
Security§
Dependencies are installed with Bun, which doesn’t run install scripts and here refuses package versions less than three days old. Lockfiles pin every version. The diary’s graph libraries (d3, pixi.js) and KaTeX are copied from those pinned packages instead of being loaded from a CDN. To report a problem, see security.txt.
Fonts§
Body text is Source Serif 4 by Frank Grießhammer, from Adobe’s full release, which includes real small caps and old-style figures. Interface text is Source Sans 3, code is IBM Plex Mono, and the Devanagari is Tiro Devanagari Sanskrit. All are under the SIL Open Font License.
Credits§
Thanks to the giants with huge deltoids on whose shoulders this site stands: Gwern Branwen and Said Achmiz for gwern.net, Edward Tufte and Dave Liepmann, Eric Lawler, Jacky Zhao, and everyone who publishes their site’s source for others to learn from.