NYPL Design Toolkit

Usage no npm install needed!

<script type="module">
  import nyplDesignToolkit from 'https://cdn.skypack.dev/@nypl/design-toolkit';


Build Status Stories in Ready

NYPL Digital Design Toolkit

Design toolkit (SASS) for the NYPL Digital team

Version: 0.1.38

View documentation

Viewing documentation locally

Setting up Jekyll

  1. Install Jekyll Enter gem install jekyll bundler in your terminal.
  2. Change directories to the docs/ folder.
  3. Run bundle install to install necessary gems.
  4. Run bundle exec jekyll serve to compile and watch the site as well as start a local server. Or just run jekyll serve.
  5. Navigate your favorite internet browser to

Compiling SCSS to CSS with Gulp or SASS CLI

  1. To view, edit and complie sass to css:

    a. For gulp: Make sure you have Node.js installed and up to date. From the root of the project run npm i. This will install the gulp dependencies.

    • Once gulp is installed, from the root, run gulp. This will compile your scss files to css and place them in the correct directory.
    • You can choose to run gulp watch, this command will actively watch the correct directory and complie files on save.

    b. Alternately you can run / compile sass directly (no Gulp required), via its CLI.

    • From the root of the project run: sass --watch sass:css/docs.
  2. Have a milkshake. 🥛

Install the toolkit in your application

View Change Log