Recreating the “Design Samsung” Grid Loading Effect
If you already come across the Samsung Corporate Design Center, you certainly have noticed the stylish grid loading effect. The colored background of an item slides in first and when it slides out again to the opposite side, the image is revealed. The color of the sliding element represents the image, i.e. it is colored in the dominant color of the picture.
To recreate this effect we will use Masonry grid with CSS animations. We’ll also make use of the ColorFinder script by pieroxy that will get the most prominent color of an image for us.