9 innovative web design trends for 2022, Masonry Cascading grid layout library


Site of the week


1) Fullpage.js

A simple and easy to use library that creates fullscreen scrolling websites (also known as single page websites or onepage sites) and adds landscape sliders inside the sections of the site.

fullPage.js is fully functional on all modern browsers, as well as some old ones such as Internet Explorer 9, Opera 12, etc. It works with browsers with CSS3 support and with the ones which don’t have it, making it ideal for old browsers compatibility. It also provides touch support for mobile phones, tablets and touch screen computers.

2) Masonry Cascading grid layout library

Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.

3) Motion One 

Motion One packs the power of the Web Animations API into a minimal API. It adds new features like selectors, individual transforms, timeline sequencing and more.

4) HTML5 and JavaScript Game Development Competition in just 13 kB

If you accidentally scroll the page down when you want to change weapons, either resize your browser windows width so there’s no scroll bar, or go to fullscreen using the button below the game!

### Features
– 2 Levels
– 5 Types of enemies
– 3 Weapons
– 30 different textures
– Music from Andy Lösch – no-fate.net
– Dynamic lighting
– Doors(!)

5) Remix

Remix is a seamless server and browser runtime that provides snappy page loads and instant transitions by leveraging distributed systems and native browser features instead of clunky static builds. Built on the Web Fetch API (instead of Node) it can run anywhere. It already runs natively on Cloudflare Workers, and of course supports serverless and traditional Node.js environments, so you can come as you are.

Page speed is only one aspect of our true goal though. We’re after better user experiences. As you’ve pushed the boundaries of the web, your tools haven’t caught up to your appetite. Remix is ready to serve you from the initial request to the fanciest UX your designers can think up. Check it out 👀

6) 9 innovative web design trends for 2022 By 99 Designs

Web design is all about looking to the future. Because of its relationship with technology, the digital realm can be a showcase for new innovations in animation, interaction and overall immersion each and every year. And 2022 promises much to look forward to, as we’ll soon discover in the following web design trends.

The 80s and 90s are making a return, typography is taking a leading role, and live animation is ascending to new heights. Visual styles, meanwhile, run the gamut from mind-bendingly high-tech to whimsically handcrafted.

7) The ultimate guide to cloud cost optimization by Leon Kuperman

The cloud’s scalability is both a blessing and a curse. Sure, you can experiment with new ideas without having to worry about getting another rack of servers. But if you’re reading this, you know there’s a price to pay for this comfort.

8) Parallax Powered by CSS Custom Properties

We just took a static image and turned it into a slick parallax scene powered by CSS custom properties! It’s funny because image sprites have been around a long time, but they still have a lot of use today!

One thought on “9 innovative web design trends for 2022, Masonry Cascading grid layout library

  1. I like parallax css great to learn css animation.