https://github.com/gion/is-dark-color

Detects if a hex color is dark or light. It is based on the w3 documentation for color luminance: https://www.w3.org/TR/WCAG20/#relativeluminancedef .
https://github.com/gion/is-dark-color

Last synced: 5 days ago
JSON representation

Detects if a hex color is dark or light. It is based on the w3 documentation for color luminance: https://www.w3.org/TR/WCAG20/#relativeluminancedef .

• Host: GitHub
• URL: https://github.com/gion/is-dark-color
• Owner: gion
• License: mit
• Created: 2018-06-06T12:37:09.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2023-08-21T17:01:58.000Z (about 1 year ago)
• Last Synced: 2024-10-31T09:37:26.330Z (17 days ago)
• Language: JavaScript
• Size: 25.4 KB
• Stars: 17
• Watchers: 0
• Forks: 4
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# is-dark-color

Detects if a hex color is dark or light. It is based on the w3 documentation for color luminance: https://www.w3.org/TR/WCAG20/#relativeluminancedef.

Useful when trying to make the text color visible on certain background colors.

This is why I needed this: ![this is why I needed this](https://media.giphy.com/media/5wFScs9NRRffxzPI2l/giphy.gif "This is why I needed this")

## Installation

`npm i -S is-dark-color`

## Usage

> es6 snippet

```javascript

import isDarkColor from 'is-dark-color'

// obvious

const whiteIsDark = isDarkColor('#ffffff') // false

const blackIsDark = isDarkColor('#000000') // true

const someColor = '#ff9900' // some sort of orange

console.log(isDarkColor(someColor)) // try it to find out

```

Optionally, you can override the return value for certain colors:

```javascript

import isDarkColor from 'is-dark-color'

const options = {

  override: {

    '#319FB5': true,

    '#383939': false,

  }

}

isDarkColor('#319FB5') // false

isDarkColor('#319FB5', options) // true

```

## Credits

Inspired from

 - https://stackoverflow.com/a/3943023/491075

 - https://stackoverflow.com/a/5624139/491075

 - https://www.w3.org/TR/WCAG20/#relativeluminancedef

## LICENCE

[MIT](./LICENCE)