A lightweight pattern library for any web project

Watch an Introduction Install Astrum

What is it?

Astrum is a lightweight pattern library designed to be included with any web project.

It's non-opinionated and doesn't expect you to write your markup or code in any particular way.

An Astrum pattern library comprises of components organised into groups. A component comprises of a rendered sample of a particular element along with a code sample and a (optional) description for the components usage. A group can also have an (optional) description and is used for organisational purposes. You also have the option to add pages of content, for example an introduction page and/or coding guidelines specific to your project.

View a demo

page divider

Why use Astrum?

Intuitive management from the command-line.

Astrum comes bundled with a command-line tool that allows you to easily manage components and groups through intuitive feedbank and prompts.

$ npm install -g astrum $ cd project-folder $ astrum init ./public/library ---------------------------------------------------------------- ✓ Pattern library initialized successfully. ---------------------------------------------------------------- To get started add your first component using: $ astrum new [group_name/component_name] To customise your pattern library locate your data.json file in ./public/library/ and add your project details.
$ astrum new btns/default New component details: ---------------------------------------------------------------- Component group: btns Component name: default ? Component title: Default ? Component width: Full width Component options: ---------------------------------------------------------------- ? Apply a dark background to the code sample? No ? Select component position in the "btns" group: Position first ---------------------------------------------------------------- ✓ Pattern library data saved successfully. ---------------------------------------------------------------- Add your component markup to ./library/components/btns/default/markup.html Add your component description to ./library/components/btns/default/description.md
$ astrum update ---------------------------------------------------------------- ✓ Pattern library successfully updated from 1.4.5 to 1.5.2. ----------------------------------------------------------------

Documentation

We’ve created full documentation for Astrum, which is updated and stored on GitHub.

View on GitHub

Help & Support

We welcome anyone and everyone to contribute to the project and help us make Astrum as versatile as possible. We’ve created guidelines for submitting bug and feature requests on GitHub.

View on GitHub Development Roadmap