body {
  width: 280px;
  margin: 40px auto;
  background-color: #A9A9A9;
}
div {
  height: 20px;
  width: 20px;
  float: left;
}

/* new lines every 13 pixels */
div:nth-of-type(13n+1) {
  clear: left;
}
const n = '' // white
const r = '#FF0305' // red
const b = '#612210' // brown
const s = '#E9A24A' // tan
const k = '#000' // black
const c = '#10447E' // cyan
const y = '#F7FD17' // yellow

const mario = [
  n,n,n,r,r,r,r,r,r,n,n,n,n,
  n,n,r,r,r,r,r,r,r,r,r,r,n,
  n,n,b,b,b,s,s,s,k,s,n,n,n,
  n,b,s,b,s,s,s,s,k,s,s,s,n,
  n,b,s,b,b,s,s,s,s,k,s,s,s,
  n,b,b,s,s,s,s,s,k,k,k,k,n,
  n,n,n,s,s,s,s,s,s,s,s,n,n,
  n,n,r,r,c,r,r,r,r,n,n,n,n,
  n,r,r,r,c,r,r,c,r,r,r,n,n,
  r,r,r,r,c,c,c,c,r,r,r,r,n,
  s,s,r,c,y,c,c,y,c,r,s,s,n,
  s,s,s,c,c,c,c,c,c,s,s,s,n,
  s,s,c,c,c,c,c,c,c,c,s,s,n,
  n,n,c,c,c,n,n,c,c,c,n,n,n,
  n,b,b,b,n,n,n,n,b,b,b,n,n,
  b,b,b,b,n,n,n,n,b,b,b,b,n
]

for(let i = 0; i < mario.length; i++) {
  document.body.innerHTML += '<div style="background-color:'+mario[i]+'"></div>'
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.