Create accountLogin

Recent searches

No recent searches

Search options

Only available when logged in.
veganism.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
Veganism Social is a welcoming space on the internet for vegans to connect and engage with the broader decentralized social media community.

Administered by:

Server stats:

230
active users

veganism.social: AboutStatusProfiles directoryPrivacy policy

Mastodon: AboutGet the appKeyboard shortcutsView source codev4.4.0-alpha.4

#gsap

3 posts3 participants0 posts today
Inautilo<p><a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Development</span></a> <a href="https://mastodon.social/tags/Announcements" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Announcements</span></a><br>GSAP is now 100% free · Good news for GSAP JavaScript animators <a href="https://ilo.im/163lnu" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">ilo.im/163lnu</span><span class="invisible"></span></a></p><p>_____<br><a href="https://mastodon.social/tags/Animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Animation</span></a> <a href="https://mastodon.social/tags/Toolset" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Toolset</span></a> <a href="https://mastodon.social/tags/GSAP" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>GSAP</span></a> <a href="https://mastodon.social/tags/Library" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Library</span></a> <a href="https://mastodon.social/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JavaScript</span></a> <a href="https://mastodon.social/tags/Npm" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Npm</span></a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDev</span></a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Frontend</span></a></p>
Ivan Moreno<p>The next 10 days are here! You can find them following the link:</p><p><a href="https://www.ivanmoreno.art/portraits/apr/20/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/apr/2</span><span class="invisible">0/</span></a></p><p>or</p><p><a href="https://www.ivanmoreno.art/portraits/apr/30/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/apr/3</span><span class="invisible">0/</span></a></p><p><a href="https://mastodon.social/tags/threejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>threejs</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/nodejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nodejs</span></a> <a href="https://mastodon.social/tags/netart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>netart</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/interactiveart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>interactiveart</span></a> <a href="https://mastodon.social/tags/stoicsism" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>stoicsism</span></a> <a href="https://mastodon.social/tags/dailystoic" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dailystoic</span></a></p><p><a href="https://mastodon.social/tags/HappyBirthdayWorldWideWeb" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>HappyBirthdayWorldWideWeb</span></a> ❤️</p>
Codrops<p>Today we are exploring a playful proof-of-concept: animating repeating "frames" of images along a path for an interesting transition effect! </p><p>Have a look: <a href="https://tympanus.net/codrops/2025/04/28/animating-in-frames-repeating-image-transition/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/codrops/2025/04/2</span><span class="invisible">8/animating-in-frames-repeating-image-transition/</span></a> </p><p><a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/webdesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdesign</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> <a href="https://mastodon.social/tags/motiondesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>motiondesign</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a></p>
Codrops<p>In today's case study, Olivier Tardif shares how he reworked Arts Corporation's site to make animations useful—not frustrating—while tackling everything from scroll freezes to autoplay sliders. 🎨✨</p><p>Dive into the technical details of his latest project, it's really worth a read! </p><p>Read it here: <a href="https://tympanus.net/codrops/2025/04/22/designing-for-flow-not-frustration-the-transformation-of-arts-corporation/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/codrops/2025/04/2</span><span class="invisible">2/designing-for-flow-not-frustration-the-transformation-of-arts-corporation/</span></a> </p><p><a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/creativedevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>creativedevelopment</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a> <a href="https://mastodon.social/tags/inspiration" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>inspiration</span></a></p>
pablolarah<p>🐻 Andy Clarke's Toon Titles<br>by <span class="h-card" translate="no"><a href="https://mastodon.social/@malarkey" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>malarkey</span></a></span> <br>Classic Hanna-Barbera title cards, brought to life using <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a>, <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SVG</span></a> and <a href="https://mastodon.social/tags/SMILanimations" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>SMILanimations</span></a></p><p><a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdev</span></a> <a href="https://mastodon.social/tags/GSAP" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>GSAP</span></a> <a href="https://mastodon.social/tags/animations" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animations</span></a> </p><p><a href="https://stuffandnonsense.co.uk/toon-titles/index.html" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">stuffandnonsense.co.uk/toon-ti</span><span class="invisible">tles/index.html</span></a></p>
Codrops<p>We're kicking off the week with a hands-on tutorial by Tom Miller on building robust GSAP-powered carousels. 🎠✨</p><p>From scroll snapping &amp; infinite loops to drag support &amp; parallax effects, it's full of tips for creating polished, accessible animations. </p><p>Dive into the full guide: <a href="https://tympanus.net/codrops/2025/04/21/mastering-carousels-with-gsap-from-basics-to-advanced-animation/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/codrops/2025/04/2</span><span class="invisible">1/mastering-carousels-with-gsap-from-basics-to-advanced-animation/</span></a></p><p><a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/tutorial" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>tutorial</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a></p>
Ivan Moreno<p>For these double Easter celebrations, take a look at these reads. You can find them following the link:</p><p><a href="https://www.ivanmoreno.art/portraits/apr/10/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/apr/1</span><span class="invisible">0/</span></a></p><p>or</p><p><a href="https://www.ivanmoreno.art/portraits/apr/20/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/apr/2</span><span class="invisible">0/</span></a></p><p><a href="https://mastodon.social/tags/threejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>threejs</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/nodejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nodejs</span></a> <a href="https://mastodon.social/tags/netart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>netart</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/interactiveart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>interactiveart</span></a> <a href="https://mastodon.social/tags/stoicsism" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>stoicsism</span></a> <a href="https://mastodon.social/tags/dailystoic" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dailystoic</span></a></p>
Codrops<p>✨ Designing a slideshow and feeling stuck? </p><p>Here's a set of fullscreen image slideshow animations from our demo archive that might just spark something 💡</p><p>Have a look: <a href="https://tympanus.net/Development/SlideshowAnimations/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/Development/Slide</span><span class="invisible">showAnimations/</span></a> </p><p><a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdev</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a> <a href="https://mastodon.social/tags/webdesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdesign</span></a></p>
Ivan Moreno<p>For these holidays, take a look at this reads. You can find them following the link:</p><p><a href="https://www.ivanmoreno.art/portraits/apr/01/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/apr/0</span><span class="invisible">1/</span></a></p><p><a href="https://mastodon.social/tags/threejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>threejs</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/nodejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nodejs</span></a> <a href="https://mastodon.social/tags/netart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>netart</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/interactiveart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>interactiveart</span></a> <a href="https://mastodon.social/tags/stoicsism" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>stoicsism</span></a> <a href="https://mastodon.social/tags/dailystoic" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dailystoic</span></a></p>
Jon Sabutis<p>Here's my submission for this month's <a href="https://mastodon.social/tags/CodePenChallenge" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CodePenChallenge</span></a></p><p>'Anodized Aluminum VR Gravity Cards'</p><p>Created using <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> and <a href="https://mastodon.social/tags/three" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>three</span></a>.js <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> </p><p><a href="https://codepen.io/jsabutis/pen/MYWRdrB" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">codepen.io/jsabutis/pen/MYWRdrB</span><span class="invisible"></span></a></p>
Codrops<p>From playful Dribbble concept to a fully interactive tribute to Warhol—Warhol Arts is more than eye candy 🎨✨</p><p>In this in-depth case study, Serhii Polyvanyi from <a href="https://blacklead.studio" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">blacklead.studio</span><span class="invisible"></span></a> breaks down how it was built with GSAP + Webflow, sharing hands-on techniques, smart workflows, and performance tips.</p><p>Read it here: <a href="https://tympanus.net/codrops/2025/04/01/warhol-arts-a-digital-playground-of-pop-pixels-and-pure-motion/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/codrops/2025/04/0</span><span class="invisible">1/warhol-arts-a-digital-playground-of-pop-pixels-and-pure-motion/</span></a> </p><p><a href="https://mastodon.social/tags/webdesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdesign</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a> <a href="https://mastodon.social/tags/website" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>website</span></a> <a href="https://mastodon.social/tags/webflow" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webflow</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/casestudy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>casestudy</span></a></p>
Ivan Moreno<p>New 10 + 1 days of this journey to read. The last of this month. You can find them following the link:</p><p><a href="https://www.ivanmoreno.art/portraits/mar/31/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">ivanmoreno.art/portraits/mar/3</span><span class="invisible">1/</span></a></p><p><a href="https://mastodon.social/tags/threejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>threejs</span></a> <a href="https://mastodon.social/tags/gsap" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gsap</span></a> <a href="https://mastodon.social/tags/nodejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nodejs</span></a> <a href="https://mastodon.social/tags/netart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>netart</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/interactiveart" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>interactiveart</span></a> <a href="https://mastodon.social/tags/stoicism" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>stoicism</span></a> <a href="https://mastodon.social/tags/dailystoic" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dailystoic</span></a></p>
Codrops<p>If you caught Stas Bondar's portfolio breakdown this week — you already know it's packed with insights.</p><p>But one detail is just too good to miss: The "About Me" text breaks apart with physics as you scroll 🔥</p><p>GSAP + Matter.js + ScrollTrigger = ✨voodoo magic✨</p><p>...and there's so much more: <a href="https://tympanus.net/codrops/2025/03/25/stas-bondar-25-the-code-techniques-behind-a-next-level-portfolio/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">tympanus.net/codrops/2025/03/2</span><span class="invisible">5/stas-bondar-25-the-code-techniques-behind-a-next-level-portfolio/</span></a></p><p><a href="https://mastodon.social/tags/webdesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdesign</span></a> <a href="https://mastodon.social/tags/webdevelopment" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdevelopment</span></a> <a href="https://mastodon.social/tags/casestudy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>casestudy</span></a> <a href="https://mastodon.social/tags/tutorial" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>tutorial</span></a> <a href="https://mastodon.social/tags/GSAP" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>GSAP</span></a> <a href="https://mastodon.social/tags/portfolio" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>portfolio</span></a> <a href="https://mastodon.social/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JavaScript</span></a></p>
Noah Liebman<p>Finally wrote a bit about my jiggly nav links.</p><p>It was mostly an exercise in making a very custom ease for <a href="https://mastodon.social/tags/GSAP" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>GSAP</span></a> out of a damped cosine function. <a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webdev</span></a> <a href="https://mastodon.social/tags/animation" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>animation</span></a> <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>css</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javascript</span></a> <a href="https://noahliebman.net/2022/12/waves-part-2-plucky/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">noahliebman.net/2022/12/waves-</span><span class="invisible">part-2-plucky/</span></a></p>
VegansExploreLive feeds
About