Eleventy Blades

June 28, 2026 · View on GitHub

Ultimate blade kit for 11ty / Build Awesome

Essential 11ty filters, transforms, and other toggleable features as a simple, configurable plugin. Reusable npm scripts included.

Quick start

There are 3 ways to get started:

A. Plugin install

Plugin gives you all the features and filters in one go without interfering with the rest of your 11ty config:

npm install @anyblades/eleventy-blades

Then addPlugin to your 11ty config:

import eleventyBladesPlugin from "@anyblades/eleventy-blades";

export default function (eleventyConfig) {
  eleventyConfig.addPlugin(eleventyBladesPlugin);
}

You can toggle features/filters like this:

eleventyConfig.addPlugin(eleventyBladesPlugin, {
  mdAutoRawTags: false,
  filters: { attr_set: false },
});

Live examples:

B. Starter projects

Eleventy Blades plugin and base package are included out-of-the-box with:

BA v4 6-in-1 Starter : Modern, lightweight Eleventy v4 multi-site starter showcasing Eleventy Blades Kit and Tailwind CLI for: [1] Tailwind CSS + Typography [2] Blades CSS [3] Bootstrap CSS [4] Pico CSS [5] Simple CSS [6] Liquid Templates.

11ty v4 Subtle : The most subtle Eleventy v4 micro-starter for content-first sites. Powered by Eleventy Blades Kit

Built-in bare-minimum examples : https://github.com/anyblades/eleventy-blades/tree/main/examples

C. Base package

Base package bundles Eleventy Blades with other popular 11ty plugins, providing a ready-to-go reusable, zero-maintenance config:

npm install @anyblades/eleventy-blades-base

# Link base templates:
cd _includes/
ln -s ../node_modules/@anyblades/blades/_includes/blades

# Run Eleventy:
eleventy --config=node_modules/@anyblades/eleventy-blades-base/eleventy.config.js

Live examples:

If you don't want to type --config=... every time, symlink it once:

ln -s node_modules/@anyblades/eleventy-blades-base/eleventy.config.js
eleventy

Or save it in your package.json scripts:

  "scripts": {
    "build": "eleventy --config=node_modules/@anyblades/eleventy-blades-base/eleventy.config.js"
  }

Alternatively, import it as a base config in your 11ty config:

import baseConfig from "@anyblades/eleventy-blades-base";

export default async function (eleventyConfig) {
  await baseConfig(eleventyConfig);
}

You can toggle features/filters like this:

await baseConfig(eleventyConfig, {
  plugins: {
    "@anyblades/eleventy-blades": {
      mdAutoRawTags: false,
      filters: { attr_set: false },
    },
  },
});

Live examples:

Documentation