Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@lephenix47/color-converter

Package Overview
Dependencies
Maintainers
1
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@lephenix47/color-converter

This is a versatile color conversion library for JavaScript. It provides a convenient way to convert color values between different color models, including RGB, HEX, HSL, HWB, and HSV. With @lephenix47/color-converter, you can effortlessly convert colors,

  • 1.0.7
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
0
Maintainers
1
Weekly downloads
 
Created
Source

@lephenix47/color-converter

Table of Contents

Introduction

The @lephenix47/color-converter library is a powerful tool for working with color models in JavaScript. It provides various classes and methods to convert between different color models, manipulate color values, and perform color-related operations.

Installation

To install my NPM Library, you can use NPM or Yarn:

npm install @lephenix47/color-converter

or

yarn add @lephenix47/color-converter

Usage

Importing the Library

To use @lephenix47/color-converter in your project, you need to import the necessary classes:

import { ColorConverter } from '@lephenix47/color-converter';

Creating Color Objects

To represent colors using the RGB, HSL, HWB, and HSV color models, you can use JavaScript objects. Each object should contain the appropriate properties for the corresponding color model. Here's an example:

const rgbColor = { red: 255, green: 0, blue: 0 };
const hslColor = { hue: 0, saturation: 100, lightness: 50 };
const hwbColor = { hue: 120, whiteness: 0, blackness: 0 };
const hsvColor = { hue: 200, saturation: 28, value: 35 };

On the other hand, you can specify the hexadecimal value as a string, with or without the '#' symbol. For example:

const color = "#0000FF"; // Hexadecimal color with the '#' symbol
const color2 = "AA83F5"; // Hexadecimal color without the '#' symbol

Converting Color Models

To convert colors between different color models, follow these steps:

  1. Create a ColorConverter instance by specifying the source color model and the color values.

It is important that rgb, hsl, hwb and hsv values are create with an object for example:

For example:

const color = { hue: 200, saturation: 28, lightness: 35 };
const converter = new ColorConverter('hsl', color);
  1. Use the convertTo method to convert the color to the desired color model. For example, to convert to the hexadecimal representation:
const hexColor = converter.convertTo('hex');

Available Conversion Methods

To get a list of all available color models supported by @lephenix47/color-converter, you can use the getAllColorModels method. This method returns an array of strings representing the supported color models. For example:

const allModels = converter.getAllColorModels();
console.log(allModels);

The allModels variable will contain an array of strings representing the available color models

Miscellaneous

ASCII tree of the project:

src/
├─ variables/
│  ├─ color-types.variables.ts
├─ classes/
│  ├─ color-conversion.classes.ts
├─ index.ts
dist/
├─ lib/
│  ├─ es6/
│  │  ├─ index.js
│  │  ├─ index.d.ts
│  │  ├─ variables/
│  │  │  ├─ color-types.variables.js
│  │  │  ├─ color-types.variables.d.ts
│  │  ├─ classes/
│  │  │  ├─ color-conversion.classes.js
│  │  │  ├─ color-conversion.classes.d.ts
│  ├─ commonjs/ # Same folder structure as es6's 
test/
├─ es6.js
├─ commonjs.js
package.json
package-lock.json
README.md
tsconfig.es5.json
tsconfig.json
.gitignore
.npmignore

Conclusion

With @lephenix47/color-converter, you can easily work with color models and perform conversions between them. Simplify your color manipulation tasks and explore the vast possibilities of color representation in your JavaScript projects.

Keywords

FAQs

Package last updated on 09 Jun 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc