GATEKEEPER

GATEKEEPER is a CLI tool that fetches data from the Figma Web API to produce styling elements (colors, typography, icons, etc) that can easily be imported into new or existing projects. It's designed to work alongside most npm-based UI projects, but is also configurable to fit different workflows.

Local development

1. Inside a new project:

• Create a .gatekeeper file containing the following:

figma_project_id: <figma_project_id>
export_colors_to: <path/to/color.scss>
export_typography_to: <path/to/typography.scss>
export_dropdown_to: <path/to/dropdown.scss>
export_icons_to: <path/to/icons.scss>

2. Inside your new project, link GATEKEEPER as dependency to your project:

$ npm link <path-to-local-gatekeeper> // Link this to your local version of GATEKEEPER

3. Run GATEKEEPER:

$ gatekeeper

CLI Configuration

| Option | Description | Default | | ----------------- | ---------------------------------------------------------------- | --------- | | --elements | Specify Design System Elements to be exported from the Figma API | colours | | --polling | Periodically completes the export flow(s) specified | false | | --pollFrequency | Specify polling frequency (ms) | 60000 |