SFGOV Pattern Lab
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 183 commits ahead, 1 commit behind chapter-three:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.


SFGOV Pattern Library.

This project is based off the PHP Twig version of Pattern Lab.


  • php-cli (If php --version returns version info, then this is already installed)
  • NodeJS
  • Composer


  1. cd pattern-lab

  2. composer install

    Answer the prompts as follows:

    • The path ./public/ already exists. Merge or replace with the contents of pattern-lab/styleguidekit-assets-default package? M
    • Update the config option styleguideKitPath? n
  3. cd ../

  4. php pattern-lab/core/console --generate

  5. npm install

Getting Started

  1. Run gulp. (You might need to re-install with npm install gulp -g)

  2. php pattern-lab/core/console --server --watch

Other Commands

Generating a public instance: $ php pattern-lab/core/console --generate

Viewing a full list of commands: $ php pattern-lab/core/console --help


  • Edit the document <head> in pattern-lab/source/_meta/00-head.twig.
  • Edit pattern styles and markup in pattern-lab/source/_patterns.
  • Add or edit Markdown files to pattern-lab/source/_patterns to document the usage and context of each pattern.
  • Add any images to pattern-lab/source/images.

All changes in /source/ automatically compile to /public.