Design inspiration curated from X

CSS card parallax with pointermove + custom props <div class=ring s... - jhey ʕ•ᴥ•ʔ

Published by jhey ʕ•ᴥ•ʔ on November 9, 2025.

CSS card parallax with pointermove + custom props <div class=ring style="--i: 2"> .ring { translate: calc(var(--px) * (var(--i) * -2rem)) calc(var(--py) * (var(--i) * 2rem)); } trick: pointer mapping to rotate card in 3...

Design notes

CSS card parallax with pointermove + custom props <div class=ring style="--i: 2"> .ring { translate: calc(var(--px) * (var(--i) * -2rem)) calc(var(--py) * (var(--i) * 2rem)); } trick: pointer mapping to rotate card in 3D + translate rings 2D for the illusion check it

This entry is part of Northlight's curated archive of interface, product, brand, website, and motion design references from public creators on X.

Image rights and licensing remain with jhey ʕ•ᴥ•ʔ; use the original X post for source and licensing inquiries.

Reference details

Creator
jhey ʕ•ᴥ•ʔ
X handle
@jh3yy
Published
November 9, 2025
Media
1 visual reference
Views
46,522
Likes
1,060
Bookmarks
639