# paulcollett/react-masonry-css

React Masonry layout component powered by CSS, dependancy free

Repository: https://github.com/paulcollett/react-masonry-css
Canonical: https://ross.abutalabs.com/products/react-masonry-css
Homepage: https://paulcollett.github.io/react-masonry-css/demo/
Language: JavaScript
License: MIT
License Family: permissive
Topics: hacktoberfest, masonry, masonry-component
Last push: 2022-02-08T19:57:08+00:00

## Health v2 (maintenance only)
Score: 32/100 (v2, computed 2026-09-03T02:20:16.233290+00:00)
- activity 0, release rhythm 35, longevity 100
- inputs: {"age_days": 3331, "days_push": 1667, "days_rel": null, "gap_med": null, "n_releases_24m": 0}
- flags: no_releases
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 1053, forks 67 (observed 2026-08-28T04:03:23.911025+00:00)

## What it is
A dependency-free React component that renders fast, responsive masonry layouts using flexbox and CSS rather than JavaScript height calculations. It supports configurable column counts at responsive breakpoints and gutters between items.

## Use cases
- create a pinterest-style masonry grid in react
- responsive image gallery with variable column counts
- masonry layout without jquery dependencies
- fast css-based column layout for cards
- breakpoint-based column counts in react
- masonry grid with gutters between items

## When to choose
- you need a lightweight, zero-dependency masonry layout in React
- you want fast rendering that respects React's virtual DOM lifecycle
- your items have similar widths and don't need height-based sorting
- you need responsive column counts at custom breakpoints

## When to avoid
- you need items with different widths in the same row
- you need height-based sorting or absolute positioning of items
- you're not using React
- you need a masonry layout with animations driven by item positions

## Facets
- artifact type: library
- maturity: maintenance
- function: ui-components, css-framework
- domain: frontend, web-development, web-design
- platform: cross-platform
- tags: react, masonry, css-layout, responsive-grid, zero-dependency, web-server, nodejs

## Member repositories
- paulcollett/react-masonry-css (main) score 32

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:03:23.911025+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-30T06:59:22.888593+00:00, confidence not recorded.
  - readme: https://github.com/paulcollett/react-masonry-css (fetched 2026-08-28T04:03:23.911025+00:00, sha ab2109dc0d6a)
  - homepage: https://paulcollett.github.io/react-masonry-css/demo/ (fetched 2026-08-29T13:00:54.486818+00:00, sha 8d469f14fb40)
  - registry_npm: https://registry.npmjs.org/react-masonry-css (fetched 2026-08-29T13:00:54.495989+00:00, sha e2f25acffa66)
- Data as of 2026-08-30T08:39:29.467469+00:00.