Svelte masonry component with SSR support (via CSS container queries) and automatic column balancing.
Masonry size: 0px × 0px (w × h)
h0 = 127px
linear-gradient(45deg, #4b776b, #76b109)
h5 = 141px
linear-gradient(45deg, #4ec127, #ea53c8)
h10 = 159px
linear-gradient(45deg, #f69bd8, #f78bf3)
h15 = 127px
linear-gradient(45deg, #f60e98, #dd7241)
h20 = 190px
linear-gradient(45deg, #339798, #e7e8b4)
h25 = 285px
linear-gradient(45deg, #330978, #b372db)
h1 = 295px
linear-gradient(45deg, #959b51, #099108)
h6 = 244px
linear-gradient(45deg, #f26f13, #5a869e)
h11 = 163px
linear-gradient(45deg, #0a9758, #c1e318)
h16 = 104px
linear-gradient(45deg, #47a6b8, #87719e)
h21 = 211px
linear-gradient(45deg, #d6d538, #5a3568)
h26 = 142px
linear-gradient(45deg, #affbb6, #573d23)
h2 = 108px
linear-gradient(45deg, #fc5705, #42cff1)
h7 = 232px
linear-gradient(45deg, #a9e768, #3bdc68)
h12 = 151px
linear-gradient(45deg, #ca6453, #3204f5)
h17 = 261px
linear-gradient(45deg, #bbd002, #c81b18)
h22 = 110px
linear-gradient(45deg, #ca3a78, #661c48)
h27 = 152px
linear-gradient(45deg, #7d93cd, #ce79d8)
h3 = 131px
linear-gradient(45deg, #f53568, #893f48)
h8 = 270px
linear-gradient(45deg, #a980b4, #21c638)
h13 = 204px
linear-gradient(45deg, #0eb5f7, #d10398)
h18 = 144px
linear-gradient(45deg, #89afe8, #f6dfcd)
h23 = 139px
linear-gradient(45deg, #23efce, #1c1bdb)
h28 = 232px
linear-gradient(45deg, #252693, #30f728)
h4 = 283px
linear-gradient(45deg, #1844d8, #c8f9d8)
h9 = 197px
linear-gradient(45deg, #58c9bf, #ed9b93)
h14 = 295px
linear-gradient(45deg, #d166e8, #e6409d)
h19 = 102px
linear-gradient(45deg, #2c5407, #595b38)
h24 = 236px
linear-gradient(45deg, #83829b, #ea37a2)
h29 = 220px
linear-gradient(45deg, #fe1496, #3dfbf2)
Sliding card flip?