Add code highlighting via highlight.js to a page without syntax highlighting by simply clicking this bookmarklet.

Easy Installation

If you just trust me and want to run JavaScript I wrote (seen below) on your browser, then just drag either or both of these up to your bookmarks bar. I've made one dark (darkula) and one light (solarized light) color scheme highlighters.

Highlight Code (dark) Highlight Code (light)

Custom Installation

Copy the code below and build your own bookmarklet here.

You can set the colorScheme variable to any you find here. Don't include the .min.css; so if I want darkula.min.css, I just have var colorScheme = 'darkula'; at the top.

Copyvar colorScheme = 'darkula';

var link = document.createElement('link');
link.setAttribute('rel', 'stylesheet');
link.setAttribute('type', 'text/css');
link.setAttribute('href', '//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.1.0/styles/' + colorScheme + '.min.css');
document.getElementsByTagName('head')[0].appendChild(link);

var script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', '//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.1.0/highlight.min.js');
document.getElementsByTagName('head')[0].appendChild(script);
script.addEventListener('load', function() {
    var pres = document.querySelectorAll('pre');
    for (var i = 0; i < pres.length; ++i) {
        if (!pres[i].querySelector('code')) {
            window.hljs.highlightBlock(pres[i]);
        } else {
            window.hljs.highlightBlock(pres[i].querySelectorAll('code')[0]);
        }
    }
});