A dark blog template using 11ty, Tailwind and Rollup

Home screenshot
Home screenshot
Home screenshot
Home screenshot



11r is a blog template with a dark color scheme built with Eleventy, the Rollup bundler, Tailwind, and Prism for syntax highlighting.


  • Eleventy for static site generation. See .eleventy.js.
  • Nunjucks for templating.
  • TailwindCSS for utility-first styling. See tailwind.config.js and src/styles/tailwind.css.
  • Prism syntax highlighting for code with copy button scripting included via clipboard.js. See src/styles/base.css for the theme; and src/scripts/copy.js, which is used by main.js.
  • Rollup for bundling and compiling. See rollup.config.js.
  • JavaScript-based privacy policy notice dismissal handling. See src/scripts/privacy-policy.js, which is used by main.js.
  • Tags.
  • Pagination.
  • Deploy script for GitHub Pages via deploy.sh, using the gh-pages branch. Be sure to edit said script to work with your repository. Remember to also configure the repository appropriately.
  • Exemplary Flexbox usage.
  • SEO mostly done for you. Ensure you replace the data referenced in src/globals/site.json, including the images in public/.


Get notified when we add new designs.

Twice a month I share the best Tailwind templates, UI kits and components in my newsletter. 30 Tailwind hackers find it useful. I'd love you to join.