Craft boba · Small-batch tea · Oakland since 2015
Steeped in Daylight
Whole-leaf tea and stone-ground matcha, shaken over pearls we boil fresh every four hours — poured to taste like the afternoon.
'/><stop offset='1' stop-color='rgb(15,22,19)'/></linearGradient><linearGradient id='tea' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='rgb(162,205,124)'/><stop offset='.55' stop-color='rgb(104,166,101)'/><stop offset='1' stop-color='rgb(56,104,70)'/></linearGradient></defs><rect width='480' height='600' fill='url(%23bg)'/><path d='M126 0 L300 0 L206 600 L58 600 Z' fill='rgb(214,190,120)' opacity='.12'/><g transform='translate(150 118)'><path d='M28 58 L152 58 L138 428 Q136 470 96 470 L84 470 Q44 470 42 428 Z' fill='url(%23tea)'/><rect x='16' y='42' width='148' height='26' rx='13' fill='rgb(230,224,208)'/><rect x='150' y='-46' width='15' height='120' rx='7' fill='rgb(230,224,208)' transform='rotate(13 157 14)'/><circle cx='68' cy='422' r='13' fill='rgb(38,30,24)'/><circle cx='104' cy='432' r='13' fill='rgb(38,30,24)'/><circle cx='90' cy='398' r='12' fill='rgb(48,38,29)'/><circle cx='120' cy='406' r='11' fill='rgb(48,38,29)'/><circle cx='56' cy='392' r='11' fill='rgb(48,38,29)'/></g></svg>)
The hero is the loudest moment — the window is only the opener.
hero-text-media-mask is the first-view opening beat: the headline is a viewport onto drifting light. Everything under it is where the other moves live; this runway exists only so the demo page scrolls.
Move the cursor across the hero to look THROUGH the type — the media glides opposite your pointer like real parallax through a peep-hole. On a phone the ambient drift still runs; the pointer parallax steps aside (no cursor to drive it).
Pour the light.
This second window lights the moment it enters view — its type is real, crawlable, and visible even if the reveal never fires.
Past the opener, the rest of the site continues — no rAF is left running.