Skip to content

Instantly share code, notes, and snippets.

View entity's full-sized avatar

Charlie J entity

View GitHub Profile
@entity
entity / app.css
Last active March 29, 2026 18:36
3D Carousel with CSS scroll-driven animations + CSS variable fallback
/* Destinations carousel — fallback: all transforms derived from a single --si CSS variable */
.carousel-card {
--raw: calc(var(--i) - var(--si));
--pos: calc(mod(var(--raw) + var(--half-n), var(--n)) - var(--half-n));
--abs: abs(var(--pos));
--sgn: sign(var(--pos));
/* scale: 1 → 0.8 → 0.7 → 0.6 (piecewise linear) */
--s: max(0.6, max(1 - 0.2 * var(--abs), 0.9 - 0.1 * var(--abs)));