← This site: the remake
Iteration 06[Lighting]iterating

A desk lamp at the top of the page.

First piece of Iteration 05's "sheet to surface" brainstorm. Two lights now: an ambient room light from above (the spotlight gradient on html, present everywhere) and a warm desk lamp anchored to the top of each page that fades as you scroll.

Hypothesis

The Lab needs a lighting story, not just a single ambient gradient. A real workspace has a primary light source — typically overhead and biased toward where you're working. The page should mirror that: bright at the top where the work begins, quieter as the visitor moves down.

Try it

Scroll this page slowly. The top is noticeably warmer than the bottom. The header area sits in the brightest band; by the time you reach the iteration footer, you're mostly under the ambient room light. You can feel the difference even without looking for it.

Easier to see on a long page: open Iteration 04 (one of the longer write-ups) and scroll from top to bottom in one motion.

How it works

Two background layers, no JavaScript:

  • Ambient room light— radial spotlight gradient on the html element, fixed to the viewport. Doesn't move with scroll. Always present, soft, centred.
  • Desk lamp — linear gradient on body, anchored to the top of the document. Brightest in the first viewport, fades through the next ~90vh, transparent thereafter. Scrolls with the page; the further down you go, the dimmer it gets.

Both gradients use the warm paper colour with calc-derived opacity so they harmonise with the brand palette automatically.

Open questions

  • Should the desk lamp be biased toward the logo position (top-left) instead of centred? Currently it's a uniform wash across the top.
  • Is the falloff distance right (90vh)? Long pages might feel like the light dies too fast; short pages might never need the falloff at all.
  • Cards don't yet adapt their shadow direction or intensity based on where they sit relative to the lights. Should they?
  • For very long pages a secondary warm pool at the bottom (the candle from the Studio, but applied inside Lab pages too) would close the loop. Worth trying?

Conclusion

Pending. Will be written after living with it on a few pages.

Iteration 06 · April 2026 · sub-iteration of 05