Related to the “Functional Core, Imperative Shell” and “Hexagonal Architecture” ideas, but fleshed out with real code.

About 28:30

Dwitter is a social network for building and sharing visual javascript demos limited to 140 characters. See the impressive creations crammed into so few characters, and play around with your own code!

Some menu link hover effects for your inspiration. Powered by CSS and JavaScript (anime.js and charming.js) for individual letter animations.

A simple morphing page transition effect where an SVG path gets morphed into another while the current page moves up. Powered by anime.js.

A small set of ideas for organic shape effects. The demos show some ways to use animated SVG morphs interactively on a website.

An experimental glitch effect powered by CSS animations and the clip-path property. Inspired by the technique seen on the speakers page of the 404 conference.

Some shape morphing hover effects on images using SVG clipPath. The idea is to create an organic, fluid feel by animating several elements on hover.

A decorative website background effect where SVG shapes are morphing and transforming on scroll. Powered by anime.js and scrollMonitor.js.

A highly experimental 3D room layout for a gallery that aims to show exhibition details in an interesting way. Uses the JS animation library anime.js.

Some inspiration for search UI effects

Preview themes from the VSCode marketplace.