Eleventufte

Eleventufte is a blog starter template for Eleventy that recreates Edward Tufte's book design and typography in a static site by replacing Eleventy's markdown parser with tufte-markdown and loading tufte-css.

What is Eleventufte?

Eleventufte is an Eleventy-based static site template that produces a Tufte-styled blog from Markdown content. It takes plain Markdown files as input and outputs a static website with a home page, post pages, an annual archive, and syndication feeds. The template was built specifically for Eleventy and uses the tufte-markdown package (a fork of standard Markdown handling) and tufte-css, a CSS library and Webfont package originally created to mimic the look of Edward Tufte's books. The repository is hosted on GitHub and includes a Netlify deployment badge linking to a live demo at eleventufte.netlify.app.

Key Features

• Eleventy static generation — Uses the lightweight Eleventy static site generator, configured to compile Markdown posts into HTML pages.
• Tufte CSS styling — Bundles the tufte-css library and Webfont package so text, headings, figures, and margins match Tufte's book layout.
• Margin notes — Instead of endnotes or footnotes, tufte-markdown converts footnote-style references into margin notes displayed beside the text.
• Image captions — Tufte-flavored Markdown adds sensible captions under figures, consistent with Tufte's documentation style.
• Prebuilt page templates — Ships with a home page, colophon, contact page, individual post template, annual archive, and RSS/syndication feeds.
• Content structure rules — Enforces prescriptive but simple rules: wrap content in an article tag and use only H2 headings for post sections to keep the document outline clean.
• Eleventy-charts planned — The roadmap mentions integrating eleventy-charts for data visualization, a signature Tufte feature.
• Netlify ready — The repo includes a Netlify deployment badge and is configured to deploy to the live demo site.

Who is it for?

• Writers and academics who want a minimal, typographically rigorous blog for long-form text with margin notes and figures.
• Developers who prefer Eleventy's lightweight approach and want a pre-built Tufte-styled base without managing CSS and Markdown parsing details themselves.
• Design-minded bloggers who want the classic Tufte book aesthetic without using a heavy or commercial blogging platform.

What can you do with Eleventufte?

• Publish a Tufte-style blog: Write posts in Markdown, use the familiar footnote syntax, and publish with automatic margin-note rendering.
• Build a personal knowledge archive: Organize posts by year with the built-in archive page and syndicate content via feeds.
• Prototype a documentation site: Use the structured H2 hierarchy and image captions to present technical information clearly, in a style Tufte popularized.

How does Eleventufte work?

Eleventufte swaps the default Markdown parser for tufte-markdown at the Eleventy configuration level. When you write a post in Markdown, tufte-markdown converts footnotes into margin notes and applies the peculiar markup that tufte-css expects. The generated static site can be deployed to any host, with Netlify support included.

Pros and cons

• Pros: Fast, lightweight static output; faithful Tufte aesthetic; built-in archive and feeds; simple content model.
• Cons: The strict content structure (only H2 sections within article tags) feels prescriptive; not well suited to feature-rich or multi-purpose blogs.

FAQ

What is Eleventufte?

Eleventufte is an open-source Eleventy starter template that uses tufte-css and tufte-markdown to create a blog with the typographic style of Edward Tufte's books.

What kind of content can I write with Eleventufte?

You write standard Markdown with footnote syntax. The template converts those footnotes to margin notes and supports image captions via Tufte-flavored Markdown.

Does Eleventufte support custom pages?

The starter includes a home, colophon, contact, post, archive, and feed pages. For other custom pages, you can add them using Eleventy's standard page creation.

Is Eleventufte suitable for a full-featured blog?

The author states it is less than ideal for a fancy, feature-rich blog; it's best for text-heavy writing with footnotes, figures, and a sensible content hierarchy.

Where can I see Eleventufte live?

A live demo is hosted at eleventufte.netlify.app, linked from the repository via a Netlify deployment badge.