HTML

<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>

LESS CSS SCSS

.makeRandom(@min: 0, @max: @min+1, @int: 0) {
  .checkInt() {
    @getNum: `Math.random() * (@{max} - @{min} + @{int})`;
    @base: unit(`@{int} == 1 ? Math.floor(@{getNum}) : @{getNum}`);
  }
  .checkInt();
  @randNum: @base + @min;
}

// Use:
@size: 100px;
@loop: 64;

.square {
  height: @size;
  width: @size;
  position: relative;
  float: left;
  
  &:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: @size;
    line-height: @size;
  	width: @size;
    text-align: center;
    color: white;
    font-weight: bold;
    font-size: 2rem;
  }
  
  
  .loop (@index) when (@index > 0){
    &:nth-of-type(@{index}) {
      
      // INIT makeRandom
      .makeRandom(.5,1.5,0);
      transform: scale(@randNum);
      // END makeRandom
      
      &:before {
      
        // INIT makeRandom
        .makeRandom(0,64,1);
        content: "@{randNum}";
        .makeRandom(0,1,0);
        background-color: fade(white,@randNum);
        // END makeRandom
        
      }
      
    }
    .loop (@index - 1);
  }
  .loop(0){}
  .loop(@loop);
  
}

// GENERAL STYLE
html,body{height:100%;}
body {
  background: black;
}