@brightlayer-ui/colors

Brightlayer UI Colors

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

It contains the following color defintions:

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

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

NOTE: the white palette does not have accent colors defined.

Installation

Install with npm

npm install --save @brightlayer-ui/colors

or yarn

yarn add @brightlayer-ui/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 '~@brightlayer-ui/colors/palette.scss'
...
background-color: map-get($blui-blue, 500)

React or React Native

import * as Colors from '@brightlayer-ui/colors';
...
<div style={{background: Colors.blue['500']}}/>