Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add ViewingConditions parameter to Hct.from #116

Open
nvlang opened this issue Aug 31, 2023 · 0 comments
Open

Add ViewingConditions parameter to Hct.from #116

nvlang opened this issue Aug 31, 2023 · 0 comments
Labels
enhancement New feature or request

Comments

@nvlang
Copy link

nvlang commented Aug 31, 2023

Introduction

I'm using the TypeScript version of the library, and as far as I can tell, the only way to specify an HCT color with a hue-chroma-tone triplet is as follows:

let color = Hct.from(10, 20, 30);
console.log(color.inViewingConditions(ViewingConditions.DEFAULT).hue);    // 9.78535871122963
console.log(color.inViewingConditions(ViewingConditions.DEFAULT).chroma); // 20.066003985753465
console.log(color.inViewingConditions(ViewingConditions.DEFAULT).tone);   // 30.089123886290032

In other words, Hct.from creates an Hct object which, in default viewing conditions, has the specified hue, chroma, and tone — or, values that are as close to the specified ones as possible. No surprise there, it's mentioned in the method's documentation.

Problem

Now, I was trying to create a color palette for a specific set of viewing conditions, e.g.:

let vc = ViewingConditions.make(undefined, undefined, 10, undefined, undefined)

(Here, vc would correspond to the default viewing conditions except with the background L* set to 10 instead of the default of 50) (i.e., a darker background).

I want the colors in my palette to appear consistent in tone and chroma for these viewing conditions, not the default viewing conditions.

let color1 = Hct.from(60,10,20);
let color2 = Hct.from(280,10,20);
console.log(color1.inViewingConditions(vc).hue);    // 60 vs 58.82148886264458
console.log(color2.inViewingConditions(vc).hue);    // 280 vs 282.2639993051888
console.log(color1.inViewingConditions(vc).chroma); // 10 vs 5.977109516590248
console.log(color2.inViewingConditions(vc).chroma); // 10 vs 6.3614473636394
console.log(color1.inViewingConditions(vc).tone);   // 20 vs 12.489930368768537
console.log(color2.inViewingConditions(vc).tone);   // 20 vs 12.480603303269618

As can be seen in the above example, this desired consistency is not guaranteed if the colors are defined with Hct.from. As a matter of fact, I don't know of any way to guarantee this consistency.

Suggestion

I would suggest adding an additional optional parameter to the Hct.from:

export declare class Hct {
    // ...
    static from(hue: number, chroma: number, tone: number, viewingConditions: ViewingConditions): Hct;
}

The color could still be stored internally as the hue-chroma-tone triplet from the default viewing conditions, of course.

@pennzht pennzht added the enhancement New feature or request label Feb 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants