JSFiddle - React, Tailwind, and code Playground

HTML

<div class="collection">
    <div style="height:50px">1</div>
    <div style="height:80px">2</div>
    <div style="height:60px">3</div>
    <div style="height:40px">4</div>
    <div style="height:50px">5</div>
    <div style="height:50px">6</div>
    <div style="height:60px">7</div>
    <div style="height:40px">8</div>
</div>

CSS

.collection { 
    -webkit-column-count: 3; 
    -moz-column-count: 3;
    column-count: 3;
    height: 200px; 
    outline: 1px dotted blue; 
    padding; 5px;
}
.collection > div { 
    background-color: orange; 
    margin-bottom: 15px;
}

JavaScript

$(document).ready(function () {
    
    $('.collection>div').each(function (n) {
        $(this).css('backgroundColor', 'hsla(60, ' + n*10 + '%, 45%, 1)');
    });
    
});