@impact-x/color v1.6.1

@impact-x/color

Colors for products using Impact X design system.

Installation

To install @impact-x/color in your project, run the following command:

npm install -S @impact-x/color

If you prefer Yarn, use the following command instead:

yarn add @impact-x/color

Usage

All color variables follow the naming convention: $ix-color-{swatch}-{grade}. Note that not all swatches have grades and this field can be removed in those cases.

Sass

In Sass, you can import and use all color variables available:

@import '~@impact-x/color';

div {
  color: $ix-color-purple;
  background-color: $ix-color-grey-50;
}

JavaScript

For JavaScript, you can import and use this module:

import { ixColorAmethyst } from '@impact-x/color';

...

const theme = {
  primaryColor: `${ixColorAmethyst}`;
}`;

API documentation

https://tw-impact-x.thoughtworks-labs.net/#/Basics/Color