23 of the best Eleventy Themes (Starters) for 2023
Tags: webdev, eleventy, 11ty, jamstack
Published: 2023-01-10 21:15:16

With [CloudCannon’s support for Eleventy now officially out of beta](https://cloudcannon.com/blog/new-eleventy-features-a-new-theme-and-full-eleventy-support/), there’s no better time to investigate a new project. What’s the best way to get started? With an Eleventy theme, of course!

Developers often use themes to save time and to get a head start on building their projects. Though we do tend to use the terms interchangeably, an Eleventy theme or ‘starter’ is slightly different in scope to a theme, at least as far as the term is used by other platforms. In a legacy CMS like WordPress, a theme is strictly a visual upgrade — set dressing, effectively. An Eleventy theme, by contrast, is usually a pre-configured Eleventy starter project that includes a basic file and directory structure, as well as some initial content and configuration. By using starter projects like this, developers can avoid having to set up a new project from scratch and can instead focus on customizing and building out the features and functionality of their site. (And, if you’re using an [Eleventy CMS](https://cloudcannon.com/eleventy-cms/) like CloudCannon, creating the perfect visual editing experience for your site’s content editors — or yourself! See our [Eleventy Setup Tutorial](https://cloudcannon.com/community/learn/eleventy-cms---get-started-with-cloudcannon/) for more advice on getting started with Eleventy and CloudCannon.)

There’s a huge range of free themes available for Eleventy — from simple templates with just a few files to more complex setups with multiple templates, layouts, and preinstalled plugins. Some of the themes I’ve listed below are designed to be minimal and bare-bones, while others include a wide range of features and functionality out of the box. By using a theme, you can choose a project structure and set of features that best fits your needs, and then customize and extend it as needed.

Using a theme can also be a great way to learn about Eleventy and how it works. Many theme include detailed documentation and examples of how to use different features and configurations, which can be helpful for those who are new to Eleventy or static site generators in general. And if you’re looking for a more basic [Eleventy tutorial for beginners](https://cloudcannon.com/community/learn/eleventy-beginner-tutorial/), we’ve got you covered.

With that in mind, let’s explore a range of popular, new, and niche Eleventy themes for a wide range of use cases.

## CloudCannon’s favorite free Eleventy themes

### Sendit

**Use case(s):** Marketing website (multipurpose)
**Author:** CloudCannon
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-launch-sendit.jpg)

Sendit is a multipurpose Eleventy theme made with the Bootstrap CSS framework. The components have been converted to [Bookshop](https://github.com/CloudCannon/bookshop). It’s the perfect starting point to see how CloudCannon works.

[Sendit demo site](https://potent-ship.cloudvent.net/)
[Sendit GitHub repo](https://github.com/CloudCannon/sendit-eleventy-template)  
[Deploy on CloudCannon](https://app.cloudcannon.com/#sites/templates/eleventy/sendit)

### Roxo

**Use case(s):** Agency / digital services
**Author:** [Static Mania](https://github.com/StaticMania)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-roxo.png)

Roxo is a responsive Eleventy theme powered by Bootstrap 4, with dedicated portfolio and blog pages. It’s easy to customize, with forms via [FabForm.io](https://fabform.io).

[Roxo demo site](https://jamstackthemes.dev/demo/theme/roxo-eleventy/)
[Roxo GitHub repo](https://github.com/StaticMania/roxo-eleventy)

### Vredeburg

**Use case(s):** Blog
**Author:** [Daff](https://github.com/dafiulh)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-vredeburg.png)

A simple starter project to create a blog using Eleventy and Tailwind CSS.

[Vredeburg demo site](https://vredeburg.netlify.app/)
[Vredeburg GitHub repo](https://github.com/dafiulh/vredeburg)

### Dark Portfolio Template

**Use case(s):** Portfolio
**Author:** [Jonathan Schrack](https://github.com/jmschrack)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-dark-portfolio.png)

A starter repository showing how to build a blog with Eleventy. Uses the W3CSS template “Dark Portfolio Template”. Note that by default, the latest 6 blog posts with the “photo” tag will be used to populate the photo gallery.

[Dark Portfolio Template demo site](https://jmschrack.dev/Dark-Portfolio-Template-11ty/)
[Dark Portfolio Template GitHub repo](https://github.com/jmschrack/Dark-Portfolio-Template-11ty/)

### jet

**Use case(s):** Multipurpose
**Author:** [Marc Amos](https://github.com/marcamos)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-jet.png)

It’s (j)ust (e)leventy and (t)ailwind via NPM scripts — and a few other really small things. This Eleventy theme is optimised for a perfect Lighthouse score.

[jet demo site](https://marcamos-jet.netlify.app/)
[jet GitHub repo](https://github.com/marcamos/jet)

### Elf

**Use case(s):** Multipurpose
**Author:** [Matt Stow](https://github.com/stowball)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-elf.png)

Elf is a simple Eleventy theme to help you create a project using standard technologies like Webpack, Babel and Sass, while also considering ease of use, performance and browser compatibility. See also: Matt Stow’s [full writeup and guide to creating Elf](https://dev.to/stowball/creating-a-production-ready-eleventy-project-with-webpack-babel-and-sass-35ep).

[Elf demo site](https://elf-eleventy.netlify.app/)
[Elf GitHub repo](https://github.com/stowball/elf)

### 11ty Sass Skeleton

**Use case(s):** Multipurpose 
**Author:** [Stephanie Eckles](https://github.com/5t3ph)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-sass-skeleton.png)

Featuring absolutely nothing beyond a base HTML5 template and the essential setup to watch and compile your Sass alongside 11ty. Includes minifiying and autoprefixing of styles postbuild using [Lightning CSS](https://lightningcss.dev/). If you have different preferred browser targets, be sure to modify both the package browserslist and the value of –target within the postbuild script.

[11ty Sass Skeleton GitHub repo](https://github.com/5t3ph/11ty-sass-skeleton)

### Smol 11ty Starter

**Use case(s):** Multipurpose
**Author:** [Stephanie Eckles](https://github.com/5t3ph)
**License:** None

An extremely minimal 11ty theme to kickstart a simple multi-page site, Smol is a nearly opinionless foundation to continue building on.

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-smol.png)

[Smol 11ty Starter GitHub repo](https://github.com/5t3ph/smol-11ty-starter)

### Tai11s

**Use case(s):** Multipurpose
**Author:** [Dan Fascia](https://github.com/danfascia)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-tai11s.png)

Tai11s is a minimal starting point for Eleventy projects using Sass/SCSS, Webpack, Babel, light-server, PostCSS, CSSnano, and Autoprefixer.

[Tai11s demo site](https://danfascia.github.io/tai11s/)
[Tai11s GitHub repo](https://github.com/danfascia/tai11s)

### 111ty

**Use case(s):** Multipurpose
**Author:** [Dan Fascia](https://github.com/danfascia)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-111ty-logo.png)

The 111ty theme contains a combination of good practices and best plugin and module choices to save you repetitive setup steps every time you create a new Eleventy site. Features include site and page level SEO, Tailwind CSS pipeline with PurgeCSS to cope with .njk, .html and .svg by default, [inlining of JS from UnPkg CDN](https://github.com/jaredgorski/eleventy-njk-unpkg-inliner#readme), a basic site.js site-level metadata file, an _includesfolder supporting SVG and component inlining as well as layouts, a barebones base.njk layout, and Nunjucks as the primary template engine.

[111ty GitHub repo](https://github.com/danfascia/111ty)

### Eleventyone

**Use case(s):** Multipurpose skeleton structure for new Eleventy projects
**Author:** [Phil Hawksworth](https://github.com/philhawksworth)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-eleventyone-r.png)

Eleventyone’s project scaffold includes: Eleventy with a skeleton site, a date format filter for Nunjucks based on [Luxon](https://moment.github.io/luxon), a tiny CSS pipeline with PostCSS, an equally tiny inline JS pipeline, JS search index generator, [Netlify Dev](https://www.netlify.com/products/dev) for testing [Netlify redirects](https://netlify.com/docs/redirects/), and a serverless (FaaS) development pipeline with [Netlify Dev](https://www.netlify.com/products/dev) and [Netlify Functions](https://www.netlify.com/products/functions).

[Eleventyone demo site](https://eleventyone.netlify.app/)
[Eleventyone GitHub repo](https://github.com/philhawksworth/eleventyone)

### Eleventy RSS Reader

**Use case(s):** RSS reader
**Author:** [Stephanie Eckles](https://github.com/5t3ph)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-rss-reader-r.png)

Create your personal RSS reader using Eleventy and modern CSS. This Eleventy theme was originally built live on Twitch — review the recordings and customization section at the GitHub link below to learn more about how it was built and how it works. (We’d also recommend checking out [Stephanie’s YouTube channel](https://www.youtube.com/channel/UCTuSQg_Ol4shhSYQ1EfpHiQ?sub_confirmation=1) for more Eleventy magic!)

[Eleventy RSS Reader GitHub repo](https://github.com/5t3ph/eleventy-rss-reader)

### Twitch Scenes

**Use case(s):** Twitch scenes
**Author:** [Stephanie Eckles](https://github.com/5t3ph)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-twitch-stream-r.png)

A slim 11ty and Sass setup to get started creating custom Twitch scenes, including responding to chat commands with ComfyJS.

[Twitch scenes GitHub repo](https://github.com/5t3ph/11ty-twitch-scenes)

### Pugsum

**Use case(s):** Multipurpose
**Author:**[Victor Tsang](https://github.com/vktrwlt)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-pugsum-r.png)

Combine a pug and a possum to make something awesome! An 11ty theme using Pug Templates and TailwindCSS.

[Pugsum demo site](https://pugsum.netlify.app/)
[Pugsum GitHub repo](https://github.com/vktrwlt/pugsum)

### 11ty.js

**Use case(s):** Blog
**Author:** [Reuben L. Lillie](https://gitlab.com/reubenlillie)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-11ty-js-r.png)

An [Eleventy](https://11ty.dev/) starter project using [JavaScript templates](https://www.11ty.dev/docs/languages/javascript/) — the vanilla JavaScript and Eleventy theme of your dreams.

[11ty.js blog demo site](https://eleventy-dot-js-blog.netlify.app/)
[11ty.js blog GitLab repo](https://gitlab.com/reubenlillie/eleventy-dot-js-blog)

### Neat Starter

**Use case(s):** Multipurpose
**Author:** [Surjith S. M.](https://github.com/surjithctly)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-neat-starter-r.png)

A starter template for Eleventy, Alpine JS & Tailwind CSS.

[Neat Starter demo site](https://neat-starter.netlify.app/)
[Neat Starter GitHub repo](https://github.com/surjithctly/neat-starter)

### Eleventy Not So Minimal Blog Starter

**Use case(s):** Blog
**Author:** [Mangamaui](https://github.com/Mangamaui)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-not-so-minimal-r.png)

A not-so-minimal Eleventy theme for building a website and blog, including navigation, image optimization, SVG icons, Luxon for dates and times, Nunjucks templates, and Sass.

[Eleventy Not So Minimal Blog Starter demo site](https://eleventy-not-so-minimal-blog-starter.netlify.app/)
[Eleventy Not So Minimal Blog Starter GitHub repo](https://github.com/Mangamaui/eleventy-not-so-minimal-blog-starter)

### Eleventy Excellent

**Use case(s):** Multipurpose
**Author:** [Lene Saile](https://github.com/madrilene)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-eleventy-excellent-r.png)

This (opinionated) Eleventy theme is based on [Andy Bell](https://twitter.com/piccalilli_)’s talk ‘Be the browser’s mentor, not its micromanager’. Features include: CSS workflow as suggested by [buildexcellentwebsit.es](http://buildexcellentwebsit.es/), accessible site navigation, editable in src/_data/navigation.js, image optimization, easy resource fetching, syntax highlighting, advanced markdown handling, SEO basics, day.js for dates and times, bundling via esbuild, an RSS feed, social links, and a Mastodon domain verification snippet.

[Eleventy Excellent demo site](https://eleventy-excellent.netlify.app/)
[Eleventy Excellent GitHub repo](https://github.com/madrilene/eleventy-excellent)

### **Skeleventy**

**Use case(s):** Portfolio / Blog
**Author:** [Joseph Dyer](https://github.com/josephdyer)
**License:** None

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-skeleventy-r.png)

Skeleventy gives you a rock-solid foundation to build fast and accessible static websites, with clean, understated design. Features include a minimal build pipeline with [Laravel Mix](https://laravel-mix.com/docs/5.0/basic-example), the Sass-powered utility class generator [Gorko](https://github.com/hankchizljaw/gorko), [Purge CSS](https://purgecss.com/), an HTML minifier, SEO-friendly page metadata, image lazy loading, responsive navigation, and an XML sitemap.

[Skeleventy demo site](https://skeleventy.netlify.app/)
[Skeleventy GitHub repo](https://github.com/josephdyer/skeleventy)

### Smix

**Use case(s):** Multipurpose (with minimal setup for Blog, Portfolio)
**Author:** [Ru Singh](https://github.com/MaybeThisIsRu)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-smix-r.png)

A standards-respecting starter kit for Eleventy. Features include Typeset, meta tags, dark mode, date filters, an Atom feed, code blocks via plugin, future-focused CSS, along with clear contrast and a11y-aware fonts.

[Smix demo site](https://smix.netlify.app/)
[Smix GitHub repo](https://github.com/MaybeThisIsRu/smix-eleventy-starter)

### Eleventy Plus Vite

**Use case(s):** Blog / Multipurpose
**Author:** [Matthias Ott](https://github.com/matthiasott)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-eleventy-plus-vite-r.png)

Simple, fast, and a little bit opinionated, Eleventy Plus Vite features Eleventy 2.0.0-canary, the new Eleventy 2.0 Dev Server with live reload, Vite 3.0 as Middleware in Eleventy Dev Server (using [eleventy-plugin-vite](https://github.com/11ty/eleventy-plugin-vite/)), build output post-processing by [Vite](https://vitejs.dev/) (with Rollup), CSS/Sass post-processing with PostCSS including [Autoprefixer](https://github.com/postcss/autoprefixer) and cssnano, a custom [CSS/Sass structure](https://matthiasott.com/notes/how-i-structure-my-css), basic fluid typography based on [Utopia](https://utopia.fyi/), dark mode support, an RSS feed, XML sitemap, and — to top it off — perfect scores on Lighthouse.

[Eleventy Plus Vite demo site](https://eleventyplusvite.netlify.app/)
[Eleventy Plus Vite GitHub repo](https://github.com/matthiasott/eleventy-plus-vite)

### Seven

**Use case(s):** Blog / Multipurpose
**Author:** [Ray Villalobos](https://github.com/planetoftheweb)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-seven-r.png)

An 11ty theme featuring Bootstrap, Sass, Webpack, search powered by Vue.js, pagination, animation, and an excellent readme and guide for installation and configuration.

[Seven demo site](https://7ty.tech/)
[Seven GitHub repo](https://github.com/planetoftheweb/seven)

### 11r

**Use case(s):** Blog theme
**Author:** [Reese Schultz](https://github.com/reeseschultz)
**License:** MIT

![](https://dam-cdn.cloudcannon.com/blog/blog-eleventy-starters-11r-r.png)

Features of this 11ty blog theme include Tailwind for utility-first styling, Nunjucks templating, Prism syntax highlighting, tags, pagination, low-config SEO, and a deploy script for GitHub Pages. See Reese’s helpful readme for more advice on configuration and personalizing 11r for you.

[11r demo site](https://reeseschultz.github.io/11r/)
[11r GitHub repo](https://github.com/reeseschultz/11r)

* * *

And there we have it! Twenty-three fresh and useful Eleventy starter themes for 2023, covering a range of use cases, integrations, and approaches to development.

Have we missed your favorite Eleventy starter? Let us know on [Twitter](https://twitter.com/CloudCannon) or [Mastodon](https://techhub.social/@cloudcannon)!