@getcircuit/colors

yarn add @getcircuit/colors

Usage no npm install needed!

<script type="module">
  import getcircuitColors from 'https://cdn.skypack.dev/@getcircuit/colors';
</script>

README

@getcircuit/colors

Install

yarn add @getcircuit/colors

Routes

Exports two values:

  • ColorList - Ordered list of color preset names
  • ColorMap - Map of color presets

And some utility methods:

  • getPresetByName - Gets the color preset by a given name.
  • getOrderedPresetName - Gets the color preset name by a given ordered number.
  • getOrderedPreset - Gets the color preset by a given ordered number.

Usage

import { getOrderedPreset } from '@getcircuit/colors/routes'

const firstColour = getOrderedPreset(0)

// {
//   active: '#476FF1',
//   inactive: '#CFD9FC',
//   text: '#2450E1',
// }
console.log(firstColour)

ColorMap

An object of colors with objects with their colour types and HEX.

export const ColorMap = {
  azure: {
    name: 'azure'
    index: 3,
    active: '#40B2F9',
    inactive: '#BFE2F8',
    text: '#1994E1',
  },
  blue: {
    name: 'blue',
    index: 10,
    active: '#3F90FA',
    inactive: '#D0E3FB',
    text: '#0D73F8',
  },
  // ...

ColorList

An array with the order of routes colors to be used.

export const ColorList = [
  'marine',
  'turqoise',
  'purple',
  // ...