Svelte Bricks
 Svelte Bricks

NPM version Docs

Naive implementation in Svelte without column balancing.

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

h0 = 151px

linear-gradient(45deg, #d74cb8, #56709c)

h1 = 115px

linear-gradient(45deg, #b220a8, #7cb9f8)

h2 = 108px

linear-gradient(45deg, #c06aed, #9e9541)

h3 = 284px

linear-gradient(45deg, #d07048, #1ea0b8)

h4 = 148px

linear-gradient(45deg, #059fe5, #472e1c)

h5 = 194px

linear-gradient(45deg, #9ef408, #968928)

h6 = 143px

linear-gradient(45deg, #5648b5, #6dac38)

h7 = 230px

linear-gradient(45deg, #6b276a, #8f4168)

h8 = 225px

linear-gradient(45deg, #fd612f, #59f722)

h9 = 198px

linear-gradient(45deg, #85457e, #3adb28)

h10 = 161px

linear-gradient(45deg, #46e90c, #0ee731)

h11 = 230px

linear-gradient(45deg, #d2bf6d, #6237d8)

h12 = 154px

linear-gradient(45deg, #ab9b03, #65d348)

h13 = 266px

linear-gradient(45deg, #2d3cc1, #ab67cc)

h14 = 102px

linear-gradient(45deg, #4a5498, #a85d6c)

h15 = 255px

linear-gradient(45deg, #3a1908, #9fe7a1)

h16 = 247px

linear-gradient(45deg, #05236a, #444a28)

h17 = 135px

linear-gradient(45deg, #ca2101, #87045e)

h18 = 128px

linear-gradient(45deg, #e93b5d, #c302f3)

h19 = 117px

linear-gradient(45deg, #2cf076, #a4d438)

h20 = 166px

linear-gradient(45deg, #546694, #5bfb38)

h21 = 140px

linear-gradient(45deg, #b6061a, #719111)

h22 = 205px

linear-gradient(45deg, #d9fbb8, #7143a8)

h23 = 293px

linear-gradient(45deg, #967b58, #6f71ae)

h24 = 133px

linear-gradient(45deg, #9fa078, #60e1f2)

h25 = 268px

linear-gradient(45deg, #995e3e, #b6afe1)

h26 = 213px

linear-gradient(45deg, #7f2e32, #812a68)

h27 = 251px

linear-gradient(45deg, #6e70f8, #f04091)

h28 = 210px

linear-gradient(45deg, #646012, #f5c745)

h29 = 218px

linear-gradient(45deg, #f2176e, #6c9788)

Sliding card flip?