Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/himynameisdave/hue-radar
🎨 Find and list all colors used in a project.
https://github.com/himynameisdave/hue-radar
audit code-analysis color color-report colors hue-radar
Last synced: 21 days ago
JSON representation
🎨 Find and list all colors used in a project.
- Host: GitHub
- URL: https://github.com/himynameisdave/hue-radar
- Owner: himynameisdave
- License: mit
- Created: 2020-10-14T02:13:24.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2021-02-01T01:40:31.000Z (almost 4 years ago)
- Last Synced: 2024-12-23T21:58:40.491Z (28 days ago)
- Topics: audit, code-analysis, color, color-report, colors, hue-radar
- Language: TypeScript
- Homepage:
- Size: 575 KB
- Stars: 0
- Watchers: 3
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
hue-radar
🎨 A tool for discovering all of the colors used in your project.
---
**`hue-radar`** is a CLI tool for discovering all of the colors used in your project.
## Purpose
If not maintained well, large and long-running web app projects are likely to have colors littered throughout the codebase. This can make it difficult for your design or front-end team to audit, scale and maintain in the long run. This tool was created to help you identify and wrangle every color in your codebase.
It's sort of like `grep`ing for various colors, but better for the following reasons:
- Handles lots of edge-cases that a complex `grep` may miss.
- Supports all color types (eg: `hex`, `hsl`, `rgb(a)`).
- Presents findings in a normalized and reasonable way.
- Can produce a comprehensive color audit report for you.
## Installation
> _Note: This has only been tested on NodeJS v12+. It is unlikely to work on versions below this._
Install the tool in your project, or (optionally) you can do it globally.
```bash
yarn add hue-radar
npm i hue-radar
# Or globally
npm i -g hue-radar
```
## Usage
Call `hue-radar` with the options you desire, in the project.
```bash
hue-radar -p "*/**.{less,jsx}"
```
### Options
Option | Description | Default | Notes
--- | --- | --- | ---
`--pattern, -p` | Glob pattern for files to match. [More info](https://github.com/isaacs/minimatch#usage). | `"**/*.css,!node_modules/**/*"` | _Defaults are always included before these patterns., so specify overrides if these do not suit you._
`--debug, -d` | Print debug statements. | `false` |
`--format, -f` | Output format for the color report, `json` or `html` | `json` |
`--output, -o` | Path to the color report outputted file _(optional)_. | `hue-radar.report.{format}` |
`--sort-algorithm, -s` | Algorithm for sorting colors (`distance | deltaE`). | `distance` | Sort by either [Euclidean distance](https://gka.github.io/chroma.js/#chroma-distance) (`distance`) or [deltaE color difference](https://gka.github.io/chroma.js/#chroma-deltae) (`deltaE`).
`--convert-to-hex, -h` | Converts all rgb/hsl colors in the report to hex, for grouping purposes. | `false` | You will still see the discovered source color, this just helps group same colors.
## Contributing
Feel free to file issues with ideas or questions, or submit pull requests with new features or bugfixes.
When submitting pull requests, at the very least please add unit tests for any new functionality, and follow the code styles set forth in the config.
## License
[](https://app.fossa.com/projects/git%2Bgithub.com%2Fhimynameisdave%2Fhue-radar?ref=badge_large)
---
> _✌️ Built by [Dave](https://github.com/himynameisdave)._