StylebotHelp

Inspect: Click on the inspect button to select an element on the page. Stylebot will automatically generate a CSS selector to match similar element(s) on the page.

URL: By default, Stylebot uses the site's domain name to match styles to websites. You can edit the urls in the Options page for more flexible matching. See syntax rules.

CSS selector: You can enter your own custom CSS selector. If you focus the CSS selector input, it will highlight all currently selected element(s).

Apply styles: Once an element is selected, you can apply styling using the basic editor to override existing styling of the page. It is automatically saved.

Font family: You can pick one of the fonts in the list. Or you can enter any custom font that exists on your local machine. You can also enter any font available on Google Fonts.

Auto-generated CSS class names: With the recent popularity of hash-based and auto-generated CSS class names, the CSS selectors may change when the site owner updates their site. This may break your custom style and you would need to update your style.

Readability: This will remove noisy elements from all the articles on a site. It will not modify any non-article pages. You can choose between Dark, Sepia and Light themes, pick any font and customize font size, line height and page width.

Grayscale: This will apply grayscale to the current site.

Enable Sync via Google Drive: You will need to enable and authorize sync via Google Drive by going to the Stylebot Options page.

Sync Now: Once enabled, you will need to manually sync from the browser menu or options page to sync your browser styles with styles backed up on Google Drive.

Backup: You can also export and import your styles as JSON.

Auth permissions: We only ask for permission for Stylebot to r/w its own files. Since we do not maintain our own server, the OAuth may timeout and you may need to re-authorize when you sync next.

Docking: You can dock the Stylebot editor on the left / right of the browser window.

Resize: You can resize the stylebot editor by clicking the icon or pressing s.

Adjust page layout: This will shrink the page width so that it does not overlap with the Stylebot editor.