/colophon

How this site is made

The tools, stack, and decisions behind matthewtrask.com.

Generator

engine

Jigsaw

A static site generator built on Laravel's Blade templating engine. Lets me write PHP logic in templates, use collections, and generate static HTML — no runtime server required.

Styling

css

Tailwind CSS v3

Utility-first CSS. Dark mode via the class strategy. The @tailwindcss/typography plugin handles prose content.

fonts

Syne · Source Serif 4 · JetBrains Mono

Syne for headings and brand — geometric, distinctive. Source Serif 4 for long-form body text — readable at any weight. JetBrains Mono for code, metadata, and labels — ligatures on. All loaded from Google Fonts.

colors

Cyan accent · Gray scale

Accent is cyan-600 (#0891b2) in light mode and cyan-400 (#22d3ee) in dark mode — used for links, hover states, and category labels. Text hierarchy runs from gray-950 for headings down through gray-700 for body copy and gray-400 for metadata. Text selection uses a 25% cyan overlay.

type scale

Custom 6-step scale

A tighter-than-default scale overrides Tailwind's defaults: xs 0.8 rem · sm 0.925 rem · base 1 rem · lg 1.125 rem · xl 1.25 rem · 2xl 1.5 rem · 3xl 1.75 rem · 4xl 2.125 rem. Line heights: normal 1.6, loose 1.75.

Assets

build

Laravel Mix (Webpack)

Compiles and versions CSS and JavaScript. PostCSS handles Tailwind, nesting, and imports. Source maps in development, minified in production.

syntax

highlight.js

Client-side syntax highlighting. Using the GitHub Dark Dimmed theme. Languages registered: PHP, JavaScript, CSS, Bash, JSON, YAML, Markdown, SCSS, HTML.

Deployment

ci

GitHub Actions

Pushing to develop triggers a build. The workflow installs dependencies, compiles assets with npm run prod, runs Jigsaw's build, then uses git subtree split to publish only the build_production/ directory to the main branch.

host

Vercel

Serves the static build from the main branch. Zero server maintenance, free, fast.

Features

Dark mode System preference detected, toggleable, persisted in localStorage.
Per-category RSS Each topic has its own feed. Subscribe to only what you want.
Reading time Estimated on every post. Calculated server-side at build time.
Code copy button Appears on hover over any code block. Copies to clipboard.
Open Graph tags Every page and post has full OG meta for rich link previews.
RSS autodiscovery Feed readers find per-category feeds automatically via <link> tags.

Source available on GitHub.