/colophon
How this site is made.
Every decision behind rin.contact — framework, fonts, deployment, design philosophy, and the easter eggs. A colophon is a printer's note. This is mine.
Framework & Runtime
Pages Router — SSG + SSR + CSR mix
via Vercel serverless functions
strict mode where it matters
nothing fancy
Styling
v3 — mobile-first, purged in production
stark, minimal, monochromatic — flat, no shadows
white · black · dot red — used sparingly
never anything in between
150–300ms ease-in-out — no bounce, no spring
Typography
weight 300–600 · headlines only
weight 300–500 · reading comfort
editorial moments only
system fallback · terminals & labels
zero layout shift, self-hosted
Deployment & Infrastructure
edge network · preview deploys on every push
registered via Namecheap
global, automatic
git push → build → alias
privacy first — no tracking pixels
Third-party Services
contact form → inbox, no backend required
on-the-fly QR generation for /card
loaded via next/font — not tracked
Performance Decisions
lazy loading, WebP conversion, responsive sizes
below-fold sections load only when needed
hero renders without any blocking resources
font display:swap + explicit image dimensions
Hidden Routes & Easter Eggs
type commands, explore career data
∑ ∇ λ σ and friends
Fibonacci phyllotaxis
5–7–5 data science absurdism
data science roasts
spin the wheel
try throwing it
model cards, SHAP, confusion matrices
every page, not XML
try it on the homepage
open your browser console
curl rin.contact
Design Philosophy
if it doesn't earn its place, it doesn't ship
density ≠ quality
375px is the source of truth
flat monochrome — the Nothing way
AA contrast, focus rings, descriptive alt text
v5.22.4 and counting