desandro/masonry

Masonry is a JavaScript library that arranges items on a webpage in a cascading grid layout. Instead of lining things up in rigid rows, it places each item in the next available vertical slot, fitting them together like stones in a wall. This is the style you've probably seen on image gallery websites and social feeds where cards of different heights stack neatly without leaving awkward empty spaces. You can add Masonry to a project in a few ways: download the file directly, link to it from a CDN, or install it via npm. Once included, you point it at a container element on your page and it automatically rearranges the child items inside it into the staggered grid pattern. It works with plain JavaScript or with jQuery, and can also be activated purely through an HTML attribute if you prefer not to write any JavaScript at all. It's a focused, single-purpose library that has been maintained for many years and has no major dependencies. The library is released under the MIT license, meaning it's free to use in personal and commercial projects.