Coloured in the grid, so it differs from your average squared paper–can't do that by hand every second
based of my initial sketch/block: d3 | simple square grid
xxxxxxxxxx
<html lang="en">
<head>
<meta charset="utf-8">
<title>d3 | simple square grid with colours</title>
<meta name="author" content="Sundar Singh | eesur.com">
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js" charset="utf-8"></script>
<style type="text/css">
body{
background-color: #130C0E;
width: 960px;
margin: 20px auto;
}
</style>
</head>
<section id='grid'></section>
<script src="d3_code_grid_colours.js" charset="utf-8"></script>
</body>
</html>
Modified http://d3js.org/d3.v3.min.js to a secure url
https://d3js.org/d3.v3.min.js
https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js