Hasty Briefsbeta

Tufte CSS

7 days ago
  • #web design
  • #Edward Tufte
  • #typography
  • Tufte CSS is a project inspired by Edward Tufte's books, focusing on simplicity, sidenotes, and typography.
  • It integrates graphics with text and emphasizes readability with off-white and off-black colors.
  • The project encourages contributions via GitHub and is designed as a starting point, not a strict design goal.
  • To use Tufte CSS, include tufte.css and the et-book fonts in your project, then apply the provided CSS rules.
  • Document structure is organized with article and section tags, using h1, h2, and h3 for headings.
  • Text styling includes the use of ETBook font, with separate files for bold and italic, and supports sans-serif via the sans class.
  • Links are underlined but maintain the body text color to reduce distraction.
  • Epigraphs are used for introducing sections with quotes, styled as blockquotes with italicized text.
  • Sidenotes and margin notes are distinctive features, designed to keep supplementary information close to the main text without disrupting flow.
  • Figures are tightly integrated with text, with options for margin figures and full-width figures.
  • Code samples are presented with monospace fonts for readability, and extended examples use pre and code elements.
  • ImageQuilts are supported for displaying collections of images in a quilt-like format.
  • The project acknowledges Edward Tufte's influence and welcomes feedback and contributions.