@c10h/colors
This project is part of the Carbon Health Interface System.
Colors and Utilities
Currently, Carbon Health (c10h) colors for product are defined in Figma.
This package pulls the color information from the Figma file via the Figma API and builds the palette file that is bundled in this package.
Additional support for:
- brightness
- luminance
- darkness, lightness assertion
- converting (css, rgb, hls)
- shade (tint) calculations
- WCG compliant readability determination
Installation
yarn add @c10h/colors
Usage
import {colors} from "@c10h/colors";
console.tabe(colors);
Color Values
| Color | Value |
|---|---|
| gray800. | #19191b |
| gray600 |
#404042. |
| gray400 |
#6e7071. |
| gray200 |
#a5a5a5. |
| gray100 |
#e6e8eb. |
| gray50 |
#f9f9f9. |
| lighterYellow | #f3ecbb |
| lighterRed | #fcd1a1 |
| lightYellow | #f3d95a |
| yellow | #ebc627 |
| lightRed | #ec8e4e |
| red | #e15c18 |
| darkYellow | #caa51c |
| darkRed | #c14111 |
| lighterPurple | #f6e4f5 |
| lightPurple | #d6c0d8 |
| purple | #baa3bf |
| darkPurple | #9877a4 |
| darkerPurple | #56336e |
| darkerYellow | #88690c |
| darkerRed | #821907 |
| lighterBlue | #9eeaef |
| lightBlue | #80d3df |
| blue | #58b3ca |
| darkBlue | #408fad |
| darkerBlue | #1c4f75 |
| lighterGreen | #b8f2c2 |
| lightGreen | #6bd9a1 |
| green | #24a06d |
| darkGreen | #158562 |
| darkerGreen | #0b5c53 |
| lighterMint | #e0fce5 |
| lightMint | #bceccf |
| mint | #a3e1c2 |
| darkMint | #77c1a3 |
| darkerMint | #338272 |
Please take a look at the tests for Color usage.