Masonry Grid

Masonry Grid / Pinterest Layout component for dynamic card layouts.

Basic Masonry Grid

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6


          <.masonry_grid items={@items} columns={3} gap={4}>
            <:item :let={item}>
              <div>{item.content}</div>
            </:item>
          </.masonry_grid>

Props

Prop	Type	Default	Description
columns	integer	3	Number of columns
gap	integer	4	Gap between items (Tailwind spacing unit)