Skip to content

Scarab Carapace

npm-beta Build Status

CSS utility class generator
Automatically generate CSS from design tokens · Breakpoints and states · Highly configurable



  1. Install Scarab Carapace as a dev-dependency (this also installs Scarab Core):

    # With yarn
    $ yarn add @scarab/carapace -D
    # Or with npm
    $ npm install @scarab/carapace --save-dev
  2. Add node_modules/ to your Sass includePaths.

  3. Import the following files to configure Carapace and generate CSS classes:

    // Import the Scarab Core library
    @import '@scarab/core/_';
    // Import your design token config
    @import 'your-design-tokens.scss';
    // Import the Carapace library
    @import '@scarab/carapace/_';
    // Import your custom module config (more on this later)
    @import 'your-custom-module-config.scss';
    // Generate Carapace CSS classes
    @import '@scarab/carapace/classes';