DSO Toolkit and Component Library

npm install dso-toolkit@7.2.0


DSO Toolkit and Component Library

This is the repository of the DSO Toolkit and Component Library.

The toolkit is framework-agnostic and based on Bootstrap v3.3.7 written in SCSS. The component library is written in Handlebars.js using Fractal. Fractal is a component library & styleguide framework.

Getting started

Releases can be found on the GitHub Releases page.

Alpha's should be considered unstable. Beta's will not have any breaking changes.


npm install dso-toolkit
  1. Add node_modules/dso-toolkit/node_modules and node_modules as include paths to your SASS compiler/wrapper (See #105 for more information)
  2. Bundle /node_modules/dso-toolkit/src/dso.scss in your build process.


The toolkit and component library are distributed to dso-toolkit.nl. Use the table below to resolve the branch/channel to the base url:

branch channel url
master stable https://cdn.dso-toolkit.nl/master/
tags only releases https://cdn.dso-toolkit.nl/VERSION/

The same goes for the component library:

branch channel url
master stable https://www.dso-toolkit.nl/master/
tags only releases https://www.dso-toolkit.nl/VERSION/
<link rel="stylesheet" href="https://cdn.dso-toolkit.nl/[master|VERSION]/styles/dso.css" />

Develop or mockups

To develop the DSO Toolkit using components and variants or create mockups of pages, forms or components

git clone git@github.com:dso-toolkit/dso-toolkit.git
cd dso-toolkit
npm install

A local webserver is started at http://localhost:3000/. See the Fractal guide on how to develop components. See CONTRIBUTING.md on how to contribute.


Node 9 and NPM 5.


The DSO Toolkit and Component Library uses

  • npm for package management
  • gulp for build automation
  • node-sass to compile sass to css
  • fractal to document the toolkit
  • yaml to configure fractal components

Fractal is configured to use handlebars and yaml.

Further reading