Flexible markdown styleguide generator with code previews
Last updated 2 years ago by johnwlong .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install glyder 
SYNC missed versions from official npm registry.


Glyder is a flexible markdown-based style guide generator with support for code previews.

Once installed, the glyder command can be used to transform any directory of Markdown files into a website.


Glyder can be installed with plain ol' NPM:

npm install -g glyder

If you'd like to install it local to a project, use the --save-dev flag:

npm install --save-dev glyder

Please note that if you install glyder local to a project you will need to use the npx command with the glyder binary. For example:

npx glyder --help


Configuration is stored in a glyder.json file stored in the root of your Glyder project.

Here are the options, with default values shown:

  "input": "src",                        // Directory where markdown and other source files are stored
  "output": "build",                     // Directory where build files are generated (HTML, etc.) 

  "tmp": ".tmp",                         // Directory for temp files generated by glyder command

  "logo": "/glyder-logo.svg",            // Relative URL for the logo of your project

  "edit": null,                          // Edit URL template. Use this format for GitHub:
                                         // ""

  "copyright": "© %Y Your Company Here"  // Copyright for your project filtered through strftime

  "sections": [                          // Sections for the navigation 
    { "name": "Guidelines", "key": "guidelines" },
    { "name": "Components", "key": "components" }

  "packages": [                          // Package sets for code previews
      name: 'oxygen',
      styles: [ '' ],
      scripts: [ '' ]

Composing articles

Articles are created by putting markdown files in your source directory. By default this is src in the root of your project, but it can be configured in the Glyder configuration file (glyder.json). All markdown files must use the ".md" file extension.

Glyder articles must include front matter. By default the title key is the only required frontmater option:

title: My article

Markdown contents here

Frontmater options include:

Key Description
title The title of the article. This appears as an H1 at the top of the page.
section The section in the side navigation where this article should appear. Sections are reference by key and can be declared in your Glyder config.
index Used to order the navigation within a section in the sidebar. Lower values are sorted first. And then by the title of the article. By default articles have a index value of 100.
noHeading Do not output the title. Instead rely on the author to include it in the Markdown portion of the article.
redirectTo Redirect to a specific URL. Implemented with an HTML meta refresh tag.

Development server

To bring up a lightweight developement server to preview your project, use the serve command:

glyder serve

This will launch a preview server here:


You must use the glyder command from the root directory of the project.

Building HTML

To generate a site in the build directory (specified in the config), use the build command:

glyder build 

Made with Gulp

Glyder is really a frontend for a bunch of Gulp tasks that combine to make a flexible style guide generator. If you are familiar with Gulp, you should find it fairly easy to contribute.


Originally based on code from John Long's styleguide repo with improvements by Michael Lee.

Current Tags

  • 2.0.3                                ...           latest (2 years ago)

6 Versions

  • 2.0.3                                ...           2 years ago
  • 2.0.2                                ...           2 years ago
  • 2.0.1                                ...           2 years ago
  • 2.0.0                                ...           2 years ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
Maintainers (1)
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 1
Dependencies (45)
Dev Dependencies (0)
Dependents (0)

Copyright 2014 - 2016 © |