Sticky About
A scroll-pinned two-column section with a stacked image gallery on the left and matching text on the right. Scroll snaps between items with clip-path reveal transitions and a progress bar. Collapses to full-screen stacked cards on mobile.
Preview




Kickandbass
A motion-forward headless Shopify storefront built for a London-based music label.
Every interaction is driven by an animation language developed from the brand's visual identity.
Westend
A nonprofit campaign site for a community arts organisation.
The brief was to make the site feel alive — every scroll, hover, and transition reinforces the brand's energy.
Delivrd
Brand identity and web for a logistics startup entering a crowded market.
The challenge was to make 'fast and reliable' feel premium rather than generic.
Socialstats
A data product for social media managers. Dense information, zero visual noise.
The design system was built to make complex analytics feel intuitive at a glance.

Kickandbass
A motion-forward headless Shopify storefront built for a London-based music label.
Every interaction is driven by an animation language developed from the brand's visual identity.

Westend
A nonprofit campaign site for a community arts organisation.
The brief was to make the site feel alive — every scroll, hover, and transition reinforces the brand's energy.

Delivrd
Brand identity and web for a logistics startup entering a crowded market.
The challenge was to make 'fast and reliable' feel premium rather than generic.

Socialstats
A data product for social media managers. Dense information, zero visual noise.
The design system was built to make complex analytics feel intuitive at a glance.
Source
import StickyAbout from "./index.jsx";
import { stickyAbout } from "../demo-data.js";
import styles from "./demo.module.css";
export default function StickyAboutDemo() {
return (
<div className={styles.page}>
<div className={styles.spacer} />
<StickyAbout items={stickyAbout.items} />
<div className={styles.spacer} />
</div>
);
}
Dependencies
gsap