Stylebot is an advanced Google Chrome extension to simplify customization of web pages in order to make them more adaptable. It is quite similar to FireBug – the most preferred Firefox webpage inspection extension among web developers. The distinctive feature is that Stylebot allows user to save the customizations made to the web page presentation and appearance, thus letting you load web page elements in any possible way.
To put it in a nutshell, all that is required is to launch it on a webpage, pick an element, customize in your way by changing CSS elements. Next time, it will load the page with all the customized styles.
The extension doesn’t support all web pages, on supported web pages you will see CSS imaged button in the address bar. Clicking this button will bring up pane at right sidebar containing all the CSS style elements. From the top of pane, you can choose an element by name or use mouse inspect pointer to select an element. Once chosen, it will list down all the applied styles in respective categories. Now you’re ready to go, you can change the CSS element values, apply new styles, and customize the existing ones.
From Advanced mode you can define CSS class or change existing styles by defining each parameter manually. All the elements’ styles are applied in real-time.
From extension’s options page, you can register hotkey, set preferred mode (Basic or Advanced), add styles, and backup customizations by exporting the styles. You can also import the styles to quickly apply them over. Last but not the least, it also allows you to sync the customizations and styles across multiple PCs, just enable bookmark sync (from browser’s settings) and click Enable Sync button.
Here is the official video below demonstrating how it works.
The real usage can be observed when you always want to load specific elements of a web page which is not perfectly designed and severely lacks cross-browser compatibility.