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.
