The Tor Styleguide is based on Bootstrap, an open-source toolkit for developing with HTML, CSS, and JS. We are currently implementing v4.0.0-beta.2.

To use the Tor styleguide, you can download our css style and import it in your project. Alternatively, you can also clone this repository and use our SASS files. SASS is a CSS extension language. Bootstrap and this styleguide are based on v3.5.4.

If you want to use SASS you can download the complete archive for the styleguide. The scss folder under assets contains all the sass files. Since we use bootstrap, we only add a few styles without modifying bootstrap core or defining new elements whenever possible. These are _tor_variables.scss and _tor.scss. These are imported in the main bootstrap scss file and compiled into the final css.

Bootstrap contains a few JavaScript libraries for extra interaction with the DOM. We use these libraries but do not add extra JavaScript. You might notice that if you run Tor Browser with high security mode, JavaScript is disabled by default. This styleguide is designed to also work for users using Tor Browser in high security mode, so that only few elements are affected if you disable JavaScript.

This styleguide has been built using Lektor. Lektor is a static content management system. You can build this yourself by installing Lektor.

Use The Tor Project Styleguide

This package includes .scss and .css files

Visit Repo

Tor UX Team

© Copyright 2017 by the Tor Project. The Tor Project is a US 501(c)(3) non-profit organization advancing human rights and freedoms by creating and deploying free and open source anonymity and privacy technologies, supporting their unrestricted availability and use, and furthering their scientific and popular understanding.