Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @pxblue/colors with all npm packages installed. Try it out:

var colors = require("@pxblue/colors")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@pxblue/colors v3.0.0

PX Blue colors for Eaton applications

PX Blue Colors

This package contains PX Blue UI color definitions. These are intended for use as primary UI colors.

It contains the following color defintions:

blue / $pxb-blue
white / $pxb-white
gray / $pxb-gray
black / $pxb-black
darkBlack / $pxb-darkBlack
red / $pxb-red
orange / $pxb-orange
gold / $pxb-gold
yellow / $pxb-yellow
green / $pxb-green
lightBlue / $pxb-lightBlue
purple / $pxb-purple

These all have color definitions for the following values: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900.

Installation

Install with npm

npm install --save @pxblue/colors

or yarn

yarn add @pxblue/colors

Usage

Incorporating these colors into your project is handled differently depending on the framework that you are using.

Angular or Ionic

// in styles.scss or your top-level sass file
@import '~@pxblue/colors/palette.scss'
...
background-color: map-get($pxb-blue, 500)

React or React Native

import * as Colors from '@pxblue/colors';
...
<div style={{background: Colors.blue['500']}}/>
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free