Svelte Bricks
 Svelte Bricks

NPM version Docs

Naive implementation in Svelte without column balancing.

Masonry size: 0px × 0px (w × h)

h0 = 148px

linear-gradient(45deg, #2e90c8, #b9a28d)

h1 = 286px

linear-gradient(45deg, #d2a9e1, #b0bc48)

h2 = 119px

linear-gradient(45deg, #cecd4e, #ab2d08)

h3 = 209px

linear-gradient(45deg, #f98ee9, #d54bc8)

h4 = 158px

linear-gradient(45deg, #4bcb02, #5b9858)

h5 = 163px

linear-gradient(45deg, #6c7706, #9f5db8)

h6 = 220px

linear-gradient(45deg, #8398d8, #f2d321)

h7 = 298px

linear-gradient(45deg, #3e1f5f, #a4ba8f)

h8 = 158px

linear-gradient(45deg, #ec8ef8, #ef0b5a)

h9 = 153px

linear-gradient(45deg, #19c299, #caba15)

h10 = 202px

linear-gradient(45deg, #a4fb1f, #6b6c9b)

h11 = 155px

linear-gradient(45deg, #a8b704, #e4feb8)

h12 = 115px

linear-gradient(45deg, #26ed82, #daeaa8)

h13 = 187px

linear-gradient(45deg, #622b58, #fdfbc4)

h14 = 116px

linear-gradient(45deg, #f0cdc5, #d57028)

h15 = 178px

linear-gradient(45deg, #962fff, #b6b53a)

h16 = 220px

linear-gradient(45deg, #44db44, #dc6892)

h17 = 169px

linear-gradient(45deg, #da0dcd, #a3a248)

h18 = 294px

linear-gradient(45deg, #f39a68, #37e567)

h19 = 179px

linear-gradient(45deg, #daf54b, #0de5d8)

h20 = 237px

linear-gradient(45deg, #92ad78, #db83c8)

h21 = 110px

linear-gradient(45deg, #db4403, #4f1cb8)

h22 = 209px

linear-gradient(45deg, #a4d715, #a765fe)

h23 = 140px

linear-gradient(45deg, #353418, #1fcb54)

h24 = 165px

linear-gradient(45deg, #c4d162, #a81248)

h25 = 273px

linear-gradient(45deg, #dc1c18, #b188bf)

h26 = 221px

linear-gradient(45deg, #e39c9e, #bed548)

h27 = 120px

linear-gradient(45deg, #9a3478, #4cff88)

h28 = 240px

linear-gradient(45deg, #f68625, #0c1598)

h29 = 217px

linear-gradient(45deg, #adafb8, #8ebdd2)

Sliding card flip?