npm

Need private packages and team management tools?Check out npm Orgs. »

@sendgrid/design-primitives

1.3.4 • Public • Published

SendGrid Design Primitives

Global design primitives/tokens to be used across SendGrid's products, stored as json data.

Packages

Current Usage

This package is currently being used for Style Guide and SendGrid.design.

Installation

npm install @sendgrid/design-primitives --save

Usage

Sass:

@import '@sendgrid/design-primitives/tokens/sg-style-guide/scss/base.scss';
 
.my-selector {
  color: $color-slate-20;
}

CSS:

@import '@sendgrid/design-primitives/tokens/sg-style-guide/css/base.css';
 
.my-selector {
  color: var(--color-slate-20);
}

JavaScript (ES6):

// Individual tokens
import { colfax } from '@sendgrid/design-primitives/tokens/sg-style-guide/es6/base.es6';
 
console.log(colfax);
 
// Token category
import { colors } from '@sendgrid/design-primitives/tokens/sg-style-guide/es6/base.es6';
 
console.log(colors.colorCodePurple);
 
// All tokens
import * as tokens from '@sendgrid/design-primitives/tokens/sg-style-guide/es6/base.es6';

JavaScript (CommonJS):

// Individual tokens
import { colfax } from '@sendgrid/design-primitives/tokens/sg-style-guide/common/base.common';
 
console.log(colfax);
 
// Token category
import { colors } from '@sendgrid/design-primitives/tokens/sg-style-guide/common/base.common';
 
console.log(colors.colorCodePurple);
 
// All tokens
import * as tokens from '@sendgrid/design-primitives/tokens/sg-style-guide/common/base.common';

Keywords

none

install

npm i @sendgrid/design-primitives

Downloadsweekly downloads

63

version

1.3.4

license

ISC

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
Report a vulnerability