Tufte CSS is a CSS stylesheet that brings Edward Tufte's distinctive handout design to HTML documents.
The project solves the problem of styling web pages with the clarity and elegance characteristic of Tufte's printed materials. It achieves this through a pure CSS approach that implements Tufte's design principles: simple typography, extensive sidenotes for marginal notes, and tight integration of graphics with text. The stylesheet works by providing semantic HTML classes and styles that users apply to standard HTML elements.
Tufte CSS suits projects where readability and visual hierarchy matter more than interactive complexity. It works well for essays, documentation, research papers, and educational content. The tool is deliberately CSS-only, excluding JavaScript solutions and integration with static site generators or print workflows, keeping the scope narrow and maintainable. Adoption requires only copying the stylesheet and font directory into a project and linking them in the HTML head.
The project is maintained but not under active development and is considered feature-complete, with refactoring and new functionality at very low priority. Testing uses Playwright to verify computed CSS properties against plain HTML fixtures. Contributions are welcome and should be thoroughly documented with clear descriptions, reproduction steps, and before-and-after screenshots, tested across device sizes from small phones to desktop screens.
