The bookmarklet can be found here and it allows you to run Baseliner on any webpage.
<script src="baseliner.js"></script>
<script>
window.onload = function() {
baseliner = new Baseliner(8);
}
</script>
This will add the Baseliner widget to your page:
If you click on Show Baseline an 8px baseline grid overlay is displayed:
You can customize the size of the grid too:
Two configuration options are supported:
gridColor
โ an RBGA array ([255, 0, 0, 255]
for red) or a color string (red
,blue
,green
orgrey
/gray
). If this option is not set, it defaults to a highly transparent red.gridHeight
โ the height of the baseline grid. If it is not set, it defaults to 10 pixels.
// a black grid, 20 pixels high
baseliner = new Baseliner({'gridColor': [0, 0, 0, 255], 'gridHeight': 20 });
// a red grid, 10 pixels high
baseliner = new Baseliner({'gridColor': 'red'});
// a very faint grey grid, 8 pixels high