Svelte masonry component with SSR support (via CSS container queries) and automatic column balancing.
Masonry size: 0px × 0px (w × h)
h0 = 190px
linear-gradient(45deg, #4bd298, #7f9538)
h5 = 257px
linear-gradient(45deg, #391d61, #4e4b78)
h10 = 164px
linear-gradient(45deg, #b4bc9d, #801308)
h15 = 265px
linear-gradient(45deg, #5fb188, #16cc55)
h20 = 293px
linear-gradient(45deg, #9ac4b8, #1bc988)
h25 = 286px
linear-gradient(45deg, #902286, #bf9ac8)
h1 = 254px
linear-gradient(45deg, #ff6e78, #409526)
h6 = 271px
linear-gradient(45deg, #b7a3a7, #a0f61a)
h11 = 210px
linear-gradient(45deg, #c4dce8, #8b5568)
h16 = 173px
linear-gradient(45deg, #1943b8, #64c921)
h21 = 108px
linear-gradient(45deg, #6cc38b, #269fb1)
h26 = 125px
linear-gradient(45deg, #86a07c, #b8ff18)
h2 = 183px
linear-gradient(45deg, #e6592d, #0ae73b)
h7 = 174px
linear-gradient(45deg, #58131d, #6bcea8)
h12 = 156px
linear-gradient(45deg, #482f48, #163282)
h17 = 146px
linear-gradient(45deg, #9011b8, #1460a4)
h22 = 256px
linear-gradient(45deg, #23d87b, #5d6c38)
h27 = 269px
linear-gradient(45deg, #9745a8, #5979c8)
h3 = 185px
linear-gradient(45deg, #389678, #674aa1)
h8 = 273px
linear-gradient(45deg, #486b6e, #aebdc8)
h13 = 277px
linear-gradient(45deg, #f57398, #969198)
h18 = 286px
linear-gradient(45deg, #882ff1, #c16738)
h23 = 131px
linear-gradient(45deg, #bd916d, #544458)
h28 = 128px
linear-gradient(45deg, #e39358, #b32ad2)
h4 = 133px
linear-gradient(45deg, #784bf8, #3be098)
h9 = 133px
linear-gradient(45deg, #0f9e08, #01a308)
h14 = 255px
linear-gradient(45deg, #59105e, #7febc9)
h19 = 169px
linear-gradient(45deg, #f4aba8, #9f1598)
h24 = 186px
linear-gradient(45deg, #d5c428, #5b3fd5)
h29 = 272px
linear-gradient(45deg, #9f7e28, #bc3fc8)
Sliding card flip?