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

[css-color-4] Linear Bradford matrices are inexact #9607

Closed
svgeesus opened this issue Nov 17, 2023 · 6 comments
Closed

[css-color-4] Linear Bradford matrices are inexact #9607

svgeesus opened this issue Nov 17, 2023 · 6 comments
Labels
Closed Accepted as Obvious Bugfix Commenter Satisfied Commenter has indicated satisfaction with the resolution / edits. css-color-4 Current Work

Comments

@svgeesus
Copy link
Contributor

From :

Conversion from colors specified using other white points is called a chromatic adaptation transform, which models the changes in the human visual system as we adapt to a new lighting condition. The Bradford algorithm [Bradford-CAT] is the industry standard chromatic adaptation transform, and is easy to calculate as it is a simple matrix multiplication.

As pointed out here the inverse matrix in color.js uses rounded off values, and in fact the matrices in the specification were calculated using those rounded-off values

// Chromatic adaptation

function D65_to_D50(XYZ) {
	// Bradford chromatic adaptation from D65 to D50
	// The matrix below is the result of three operations:
	// - convert from XYZ to retinal cone domain
	// - scale components from one reference white to another
	// - convert back to XYZ
	// http://www.brucelindbloom.com/index.html?Eqn_ChromAdapt.html
	var M =  [
		[  1.0479298208405488,    0.022946793341019088,  -0.05019222954313557 ],
		[  0.029627815688159344,  0.990434484573249,     -0.01707382502938514 ],
		[ -0.009243058152591178,  0.015055144896577895,   0.7518742899580008  ]
	];

	return multiplyMatrices(M, XYZ);
}

function D50_to_D65(XYZ) {
	// Bradford chromatic adaptation from D50 to D65
	var M = [
		[  0.9554734527042182,   -0.023098536874261423,  0.0632593086610217   ],
		[ -0.028369706963208136,  1.0099954580058226,    0.021041398966943008 ],
		[  0.012314001688319899, -0.020507696433477912,  1.3303659366080753   ]
	];

	return multiplyMatrices(M, XYZ);
}

which produce small inaccuracies when round-tripping. These can accumulate to the point they introduce small, but visible, artifacts.

Also there are also two Bradford transforms: the original, given in the references section, and the linear simplification introduced by the ICC which is a simple 3x3 matrix.

The spec says "linear Bradford" in 11. Converting Colors and elsewhere just uses "Bradford"; that should be corrected for clarity.

@svgeesus svgeesus changed the title Linear Bradford matrices are inexact [css-color-4] Linear Bradford matrices are inexact Nov 17, 2023
@svgeesus svgeesus added the css-color-4 Current Work label Nov 17, 2023
@svgeesus
Copy link
Contributor Author

Related: linear Bradford slightly better than CAT16

Correct reference for linear Bradford would be E.3 Linearized Bradford transformation in ICC.1-2022-05

@svgeesus
Copy link
Contributor Author

svgeesus commented Nov 22, 2023

Matrices fixed by 9c4db75

See https://github.com/LeaVerou/color.js/pull/354/files

@svgeesus
Copy link
Contributor Author

linear vs. original Bradford disambiguation fixed by 66a09e4

@svgeesus svgeesus added Closed Accepted as Obvious Bugfix Commenter Satisfied Commenter has indicated satisfaction with the resolution / edits. and removed Needs Edits labels Nov 22, 2023
@romainmenke
Copy link
Member

Is it possible that there was a copy/paste mistake here?
When using the values from 9c4db75 we get very different outputs.

- rgba(51, 102, 153, 0.8)
+ rgba(44, 111, 115, 0.8)

This is more than what could be explained by slightly different rounding.

@svgeesus
Copy link
Contributor Author

Yes, see color-js/color.js#360 so I need to update again with these values.

(I admit I was surprised by the magnitude of change in that matrix)

@svgeesus
Copy link
Contributor Author

Fixed by 5ae7930

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Closed Accepted as Obvious Bugfix Commenter Satisfied Commenter has indicated satisfaction with the resolution / edits. css-color-4 Current Work
Projects
None yet
Development

No branches or pull requests

2 participants