Skip to content
plugin to add anchors to headings using GitHub’s algorithm
Branch: master
Clone or download
Latest commit cdd8a85 Jul 22, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
.editorconfig Refactor code-style to use `xo` Aug 24, 2016
.gitignore Add `yarn.lock` to `.gitignore` Aug 13, 2018
.npmrc Add `.npmrc` Aug 13, 2018
.prettierignore Add `.prettierignore` Aug 13, 2018
.travis.yml Update Node in Travis Jun 16, 2019
index.js Refactor comments Jun 16, 2019
license Move `LICENSE` > `license` Oct 22, 2018
package.json Update dev-dependencies Jul 22, 2019 Add notes on security Jul 22, 2019
test.js Refactor tests Jun 16, 2019


Build Coverage Downloads Size Sponsors Backers Chat

remark plugin to add anchors headings using GitHub’s algorithm.

⚠️ Note: This is often useful when compiling to HTML. If you’re doing that, it’s probably smarter to use remark-rehype and rehype-slug and benefit from the rehype ecosystem.



npm install remark-slug


Say we have the following file,

# Lorem ipsum 😪

## dolor—sit—amet

### consectetur & adipisicing

#### elit

##### elit

And our script, example.js, looks as follows:

var fs = require('fs')
var unified = require('unified')
var markdown = require('remark-parse')
var slug = require('remark-slug')
var remark2rehype = require('remark-rehype')
var html = require('rehype-stringify')

  .process(fs.readFileSync(''), function(err, file) {
    if (err) throw err

Now, running node example yields:

<h1 id="lorem-ipsum-">Lorem ipsum 😪</h1>
<h2 id="dolorsitamet">dolor—sit—amet</h2>
<h3 id="consectetur--adipisicing">consectetur &#x26; adipisicing</h3>
<h4 id="elit">elit</h4>
<h5 id="elit-1">elit</h5>



Add anchors headings using GitHub’s algorithm.

Uses github-slugger to creates GitHub-style slugs.

Sets and on headings. The first can be used by any plugin as a unique identifier, the second tells mdast-util-to-hast (used in remark-html and remark-rehype) to use its value as an id attribute.


Use of remark-slug can open you up to a cross-site scripting (XSS) attack as it sets id attributes on headings. In a browser, elements are retrievable by id with JavaScript and CSS. If a user injects a heading that slugs to an id you are already using, the user content may impersonate the website.

Always be wary with user input and use rehype-sanitize.



See in remarkjs/.github for ways to get started. See for ways to get help.

This project has a Code of Conduct. By interacting with this repository, organisation, or community you agree to abide by its terms.


MIT © Titus Wormer

You can’t perform that action at this time.