Here's how this was made.

Typography

• Neue Haas Grotesk Display — headings. The typeface that everything else is trying to be. Designed by Max Miedinger, 1957. Helvetica's serious older sibling.
• Neue Haas Grotesk Text — body. Same family, optimized for reading rather than impact. The distinction matters.
• System monospace stack — code, HUDs, classified readouts. ui-monospace, Menlo, Consolas. No web font for the terminals. Feels right.

Stack

• HTML — one file per page. No templates, no components, no abstraction layer to apologize for later.
• CSS — single file, ~830 lines. No preprocessor. Custom properties where needed. clamp() everywhere. text-wrap: balance on headings because it matters.
• JavaScript — single file, ~1200 lines, vanilla. No framework. The palantír cursor, 23 easter eggs, a command palette, native i18n across 6 languages including Black Speech, and adaptive nav color — in one file. This is possible if you don't import lodash.
• PHP — newsletter signup, export endpoint. Two files. Bluehost shared hosting. We contain multitudes.
• Hosting — Bluehost. Yes. We know. The forge is in St. Pete and so is the server, metaphorically.

Influences

• Heart — the design system this site is built on. Dense, vertical, no grid containers. Correct.
• Emil Kowalski — spring animations, reveal choreography, the scramble effect. The reference for motion on the web that doesn't feel like a framework demo.
• Stripe — for proving you can be technical and designed simultaneously. Also for the robots.txt inspiration.
• Linear — for the command palette. Theirs is better. Ours has "Cast the ring into the fire" as an option, which balances it out.
• Tolkien — for the name, the lore, the Black Speech translations, and the useful caution about building things with the power to dominate.

Easter Eggs

There are 23. Listed below, except three which remain undocumented. If you find all 23 and can name the three missing, email us. We'll be impressed.

• 01 Click the [NEWS] tag in the newsbar — satellite imagery overlay
• 02 Scroll to footer — the aim-for-the-stars line decodes itself, then glows gold
• 03 Hold Shift — crosshair cursor / aim mode activates on imagery
• 04 Konami code (↑↑↓↓←→←→BA) — operator mode + night vision
• 05 Type isengard — global gold flood + ember particles
• 06 Click the brand star 7 times — ACCESS GRANTED / Saruman mode
• 07 Switch tabs — title becomes // hold the line
• 08 Type mordor — YOU CANNOT PASS + invert
• 09 Click a redacted ████ block — classified content revealed
• 10 Click the GRID readout — opens St. Pete in Maps
• 11 Click the CAGE code — copies to clipboard
• 12 Right-click the classified office address — secret context menu
• 13 ⌘K / Ctrl+K — command palette with lore commands
• 14 Language picker — Eye of Sauron flag = Black Speech mode
• 15 Type doom — DOOM (1993) launches in classified mode
• 16 Type gravity — ragdoll physics. Everything falls. Reset on reload.
• 17 Type precision — "Noted." (That's it. Withholding is funnier.)
• 18 Hover the period at end of the footer line — reveals "..so far."
• 19 Visit on April 1 — the forge has opinions about the date
• 20 window.SARUMAN in console — dry responses to method calls
• ?? Three more. Undocumented. They reward a specific kind of attention.

ARG

There's a chain. /the-ring is the first link. The DevTools network tab contains the second. The third is in a header on a page you've already seen. We didn't finish the fourth. That's also canonical.

Further reading

• Changelog — features logged deadpan, as if they were serious
• /the-ring — the ARG starts here
• /doom — the stress-relief module