How this site works
01 Type
Three typefaces, down from four. I tried a Caslon, then a Garamond, and binned both because neither sat right next to the sans. A story is not a reason. When a word needs emphasis, the same typeface leans over.
Schibsted Grotesk carries the prose.
built for a Scandinavian newsroom, reads like oneand it leans when a word matters.
its own true italicand the margin notes are an actual ballpoint
Reenie Beanie. the one red biro is a real biroسبحان الله
Amiri counts the dhikr. Revived from the Amiria Press in Cairo02 Colour
The colours are warm paper, warm ink and one seal red, and the red is used sparingly so it still means something when it shows up. The only gold on the site appears when you select text, so go on, select this sentence.
Dark mode is called after Maghrib in the stylesheet. The moon is the same sun with its rays folded away.
03 Motion
The three speeds are named like gears. Swift at 160ms for feedback, settle at 340ms for state, grand at 700ms for entrances. Everything slows down as it lands, the way a real object would. Nothing bounces except the tasbih bead.
Ask for reduced motion and the site sits still, including the race you just ran.
04 Small details
The clock is a nod to Bilal. It reads your timezone, works out the prayer times on your own machine and tells you what’s next where you are, and inside half an hour of a prayer it stops telling the time and starts nudging you. It never asks where you are and nothing gets sent anywhere. Press t for the tasbih, thirty-three to the ring, which came from dhikry. ⌘K opens the palette.
The favicon is a seal, س stamped in red. The margin notes draw themselves in as you reach them, ink first and words after, the way notes actually get written. Links underline in hairline ink and only commit to red when you hover.
05 Colophon
Fifteen pages on one stylesheet and one script, no framework. The venture pages write themselves from my own archive, so what reaches you is still static files. The fonts live here rather than on Google, subset down to the characters this site actually sets. Nothing asks another origin for anything, which rules out analytics.
Websites are a hobby. The day job is Draper.