Updates

api/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span
@@ -81,6 +81,7 @@ <h1>API Reference</h1>
 <li><a href='#differenceHueSaturation'>differenceHueSaturation</a></li>
 <li><a href='#differenceHyab'>differenceHyab</a></li>
 <li><a href='#differenceKotsarenkoRamos'>differenceKotsarenkoRamos</a></li>
+<li><a href='#differenceItp'>differenceItp</a></li>
 <li><a href='#displayable'>displayable</a></li>
 <li><a href='#color-spaces'>dlab</a></li>
 <li><a href='#color-spaces'>dlch</a></li>
@@ -787,7 +788,7 @@ <h3>Euclidean distance</h3>
 <p><a id="differenceEuclidean" href="#differenceEuclidean">#</a> <strong>differenceEuclidean</strong>(<em>mode = 'rgb'</em>, <em>weights = [1, 1, 1, 0]</em>)</p>
 <p><span aria-label='Source:'>☞</span> <a href="https://github.com/evercoder/culori/blob/main/src/difference.js">src/difference.js</a></p>
 <p>Returns a <a href="https://en.wikipedia.org/wiki/Color_difference#Euclidean">Euclidean distance</a> function in a certain color space.</p>
-<p>You can optionally assign different weights to the channels in the color space. See, for example, the <a href="#differenceKotsarenkoRamos">Kotsarenko/Ramos distance</a>.</p>
+<p>You can optionally assign different weights to the channels in the color space. See, for example, the <a href="#differenceKotsarenkoRamos">Kotsarenko/Ramos distance</a> or <a href="#differenceItp">ΔE<sub>ITP</sub></a>.</p>
 <p>The default weights <code>[1, 1, 1, 0]</code> mean that the <em>alpha</em>, which is the fourth channel in all the color spaces Culori defines, is not taken into account. Send <code>[1, 1, 1, 1]</code> as the weights to include it in the computation.</p>
 <p>In cylindrical spaces, the hue is factored into the Euclidean distance in a variety of ways. The functions below are used internally:</p>
 <p><a id="differenceHueChroma" href="#differenceHueChroma">#</a> <strong>differenceHueChroma</strong>(<em>colorA</em>, <em>colorB</em>)</p>
@@ -828,6 +829,9 @@ <h3>Other difference formulas</h3>
 <p><a id="differenceKotsarenkoRamos" href="#differenceKotsarenkoRamos">#</a> <strong>differenceKotsarenkoRamos</strong>()</p>
 <p><span aria-label='Source:'>☞</span> <a href="https://github.com/evercoder/culori/blob/main/src/difference.js">src/difference.js</a></p>
 <p>Computes the <a href="http://www.progmat.uaem.mx:8080/artVol2Num2/Articulo3Vol2Num2.pdf">Kotsarenko/Ramos</a> color difference between the colors <em>a</em> and <em>b</em>. This is a weighted Euclidean distance in the <code>yiq</code> color space.</p>
+<p><a id="differenceItp" href="#differenceItp">#</a> <strong>differenceItp</strong>()</p>
+<p><span aria-label='Source:'>☞</span> <a href="https://github.com/evercoder/culori/blob/main/src/difference.js">src/difference.js</a></p>
+<p>Computes the <a href="https://www.itu.int/rec/R-REC-BT.2124/en">ΔE<sub>ITP</sub></a> color difference metric between the colors <em>a</em> and <em>b</em>. This is a weighted Euclidean distance in the <code>itp</code> color space, scaled by a factor of 720 so that a the just-noticeable difference (<abbr>JND</abbr>) corresponds to a value of 1.</p>
 <h3>Nearest color(s)</h3>
 <p><a id="nearest" href="#nearest">#</a> <strong>nearest</strong>(<em>colors</em>, <em>metric = differenceEuclidean()</em>, <em>accessor = identity</em>) → <em>function(color, n = 1, τ = Infinity)</em></p>
 <p><span aria-label='Source:'>☞</span> <a href="https://github.com/evercoder/culori/blob/main/src/nearest.js">src/nearest.js</a></p>
@@ -1096,6 +1100,11 @@ <h2 id='color-spaces'>
 <td><code>modeHwb</code></td>
 </tr>
 <tr>
+<td><code>itp</code></td>
+<td>IC<sub>t</sub>C<sub>p</sub> color space</td>
+<td><code>modeItp</code></td>
+</tr>
+<tr>
 <td><code>jab</code></td>
 <td>J<sub>z</sub>a<sub>z</sub>b<sub>z</sub> color space</td>
 <td><code>modeJab</code></td>

colophon/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span

color-spaces/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span
@@ -809,12 +809,44 @@ <h4><code>xyb</code></h4>
 </tr>
 <tr>
 <td><code>b</code></td>
-<td><code>[ -0.2778, 0.3880 ]</code> ≈</td>
+<td><code>[ -0.2778, 0.3880 ]</code>≈</td>
 <td>Blue-yellow component</td>
 </tr>
 </tbody>
 </table>
 <p>Does not have gamut limits.</p>
+<h3><abbr>IC<sub>t</sub>C<sub>p</sub></abbr></h3>
+<p><abbr>IC<sub>t</sub>C<sub>p</sub></abbr> (or <abbr>ITP</abbr>) color space developed by <a href="https://professional.dolby.com/siteassets/pdfs/ictcp_dolbywhitepaper_v071.pdf">Dolby Laboratories</a>, as defined in <a href="https://www.itu.int/rec/R-REC-BT.2100"><abbr>ITU-R</abbr> Recommendation BT.2100</a>. It is included in the <abbr>CSS</abbr> <a href="https://drafts.csswg.org/css-color-hdr/#ICtCp"><abbr>HDR</abbr> Color Module Level 1</a> specification.</p>
+<h4><code>itp</code></h4>
+<table>
+<thead>
+<tr>
+<th>Channel</th>
+<th>Range</th>
+<th>Description</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td><code>i</code></td>
+<td><code>[0, 0.581]</code>≈</td>
+<td>Intensity</td>
+</tr>
+<tr>
+<td><code>t</code></td>
+<td><code>[-0.282, 0.278]</code>≈</td>
+<td>Blue-yellow component (“tritanopia”)</td>
+</tr>
+<tr>
+<td><code>p</code></td>
+<td><code>[-0.162, 0.279]</code>≈</td>
+<td>Green–red component (“protanopia”)</td>
+</tr>
+</tbody>
+</table>
+<p>Serialized as <code>color(--ictcp i t p)</code>, with the <code>none</code> keyword for any missing color channel. An explicit <code>alpha &lt; 1</code> is included as <code> / alpha</code>.</p>
+<p>Does not have gamut limits.</p>
+<p>The <code>itp</code> color space is the basis of the <a href="/api/#differenceItp">ΔE<sub>ITP</sub> color difference</a> metric defined in <em>Objective metric for the assessment of the potential visibility of colour differences in television</em> (<a href="https://www.itu.int/rec/R-REC-BT.2124/en">Rec. ITU-R BT.2124</a>).</p>
 <h3>Cubehelix</h3>
 <p><a href="https://www.mrao.cam.ac.uk/~dag/CUBEHELIX/">The Cubehelix color scheme</a> was described by Dave Green in this paper:</p>
 <blockquote>

getting-started/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span
@@ -105,11 +105,11 @@ <h3>In your browser's console</h3>
 <h3>Observable</h3>
 <p>If you prefer to see the results visually, <a href="https://beta.observablehq.com">Observable</a> is a great place to tinker with the library.</p>
 <p>Add this cell and you're good to go:</p>
-<pre class="language-js"><code class="language-js">culori <span class="token operator">=</span> <span class="token keyword">import</span><span class="token punctuation">(</span><span class="token string">'culori@3.3.0'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
+<pre class="language-js"><code class="language-js">culori <span class="token operator">=</span> <span class="token keyword">import</span><span class="token punctuation">(</span><span class="token string">'culori@4.0.0'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
 <p>It's often useful to pin the library to a specific version, to make sure your old notebooks don't break if the API changes in a new major version of the library.</p>
 <h2>Use Culori in Deno</h2>
 <p>The library is published to <a href="https://deno.land/x/culori">deno.land/x/culori</a> for usage in <a href="https://deno.land/">Deno</a>:</p>
-<pre class="language-js"><code class="language-js"><span class="token keyword">import</span> <span class="token punctuation">{</span> rgb <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'https://deno.land/x/culori@3.3.0/index.js'</span><span class="token punctuation">;</span>
+<pre class="language-js"><code class="language-js"><span class="token keyword">import</span> <span class="token punctuation">{</span> rgb <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'https://deno.land/x/culori@4.0.0/index.js'</span><span class="token punctuation">;</span>
 
 <span class="token function">rgb</span><span class="token punctuation">(</span><span class="token string">'tomato'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
 

guides/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span

guides/migration/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span

guides/tree-shaking/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span
@@ -137,7 +137,7 @@ <h3 id='culori-css'><code>culori/css</code></h3>
 <span class="token function">interpolate</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'red'</span><span class="token punctuation">,</span> <span class="token string">'green'</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token string">'lch'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
 <h3><code>culori/all</code></h3>
 <p>Bootstrap all the color spaces available in Culori.</p>
-<p>It provides the following named exports: <code>a98</code>, <code>cubehelix</code>, <code>dlab</code>, <code>dlch</code>, <code>hsi</code>, <code>hsl</code>, <code>hsv</code>, <code>hwb</code>, <code>jab</code>, <code>jch</code>, <code>lab</code>, <code>lab65</code>, <code>lch</code>, <code>lch65</code>, <code>lchuv</code>, <code>lrgb</code>, <code>luv</code>, <code>okhsl</code>, <code>okhsv</code>, <code>oklab</code>, <code>oklch</code>, <code>p3</code>, <code>prophoto</code>, <code>rec2020</code>, <code>rgb</code>, <code>xyb</code>, <code>xyz50</code>, <code>xyz65</code>, and <code>yiq</code>.</p>
+<p>It provides the following named exports: <code>a98</code>, <code>cubehelix</code>, <code>dlab</code>, <code>dlch</code>, <code>hsi</code>, <code>hsl</code>, <code>hsv</code>, <code>hwb</code>, <code>itp</code>, <code>jab</code>, <code>jch</code>, <code>lab</code>, <code>lab65</code>, <code>lch</code>, <code>lch65</code>, <code>lchuv</code>, <code>lrgb</code>, <code>luv</code>, <code>okhsl</code>, <code>okhsv</code>, <code>oklab</code>, <code>oklch</code>, <code>p3</code>, <code>prophoto</code>, <code>rec2020</code>, <code>rgb</code>, <code>xyb</code>, <code>xyz50</code>, <code>xyz65</code>, and <code>yiq</code>.</p>
 <pre class="language-js"><code class="language-js"><span class="token keyword">import</span> <span class="token string">'culori/all'</span><span class="token punctuation">;</span>
 <span class="token keyword">import</span> <span class="token punctuation">{</span> interpolate <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'culori/fn'</span><span class="token punctuation">;</span>
 

index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span

resources/index.html

@@ -23,7 +23,7 @@
 						/>
 					</a>
 					<span
-						>v3.3.0 (<a
+						>v4.0.0 (<a
 							href="https://github.com/evercoder/culori/releases"
 							>changelog</a
 						>)</span
@@ -70,33 +70,30 @@ <h2>Products using Culori</h2>
 <li><a href="https://github.com/meodai/color-name-api">Color Name API</a> — a REST API for color names that makes use Culori's <a href="https://culorijs.org/api/#differenceCiede2000">differenceCiede2000</a> to return a fitting name for every color.</li>
 <li><a href="https://atmos.style">Atmos</a> - a toolbox based on (OK)LCH color space for creating professional color palettes. Utilizing Culori for color manipulation allowed us to concentrate on our product's essence rather than getting bogged down in implementation details.</li>
 </ul>
-<p>Does your product/project use Culori? Create a PR and add yourself to this list.</p>
+<p><em>Does your product/project use Culori? Create a PR and add yourself to this list.</em></p>
 <h2>Similar projects</h2>
-<p>JavaScript libraries:</p>
 <ul>
-<li><a href="https://github.com/d3/d3-color">d3-color</a> by <a href="https://bost.ocks.org/mike/">Mike Bostock</a></li>
-<li><a href="https://github.com/gka/chroma.js">chroma.js</a> by <a href="https://driven-by-data.net/">Gregor Aisch</a></li>
-<li><a href="https://github.com/LeaVerou/color.js">colorjs.io</a> by <a href="http://lea.verou.me/">Lea Verou</a> and <a href="https://svgees.us/">Chris Lilley</a></li>
-</ul>
-<p>In other languages:</p>
-<ul>
-<li><a href="https://www.colour-science.org/">Colour</a> for Python</li>
-<li><a href="http://colorspace.r-forge.r-project.org/">the <code>colorspace</code> package</a> for R</li>
-<li><a href="https://github.com/JuliaGraphics/Colors.jl">the <code>Colors</code> package</a> for Julia</li>
-<li><a href="https://github.com/facelessuser/coloraide">ColorAide</a> for Python by Isaac Muse</li>
-<li><a href="https://github.com/nschloe/colorio">colorio</a> for Python by Nico Schlömer</li>
+<li><a href="https://github.com/d3/d3-color">d3-color</a> by <a href="https://bost.ocks.org/mike/">Mike Bostock</a> (JavaScript)</li>
+<li><a href="https://github.com/gka/chroma.js">chroma.js</a> by <a href="https://driven-by-data.net/">Gregor Aisch</a> (JavaScript)</li>
+<li><a href="https://github.com/LeaVerou/color.js">colorjs.io</a> by <a href="http://lea.verou.me/">Lea Verou</a> and <a href="https://svgees.us/">Chris Lilley</a> (JavaScript)</li>
+<li><a href="https://www.colour-science.org/">Colour</a> (Python)</li>
+<li><a href="https://github.com/facelessuser/coloraide">ColorAide</a> by Isaac Muse (Python)</li>
+<li><a href="https://github.com/nschloe/colorio">colorio</a> by Nico Schlömer (Python)</li>
+<li><a href="http://colorspace.r-forge.r-project.org/"><code>colorspace</code> package</a> (R)</li>
+<li><a href="https://github.com/JuliaGraphics/Colors.jl"><code>Colors</code> package</a> (Julia)</li>
 </ul>
 <h2>Further reading</h2>
 <h3>Specifications</h3>
 <ul>
-<li><a href="https://drafts.csswg.org/css-color/">CSS Color Level 4</a></li>
-<li><a href="https://drafts.csswg.org/css-color-5/">CSS Color Level 5</a></li>
+<li><a href="https://drafts.csswg.org/css-color-4/">CSS Color Module Level 4</a> [<a href="https://github.com/w3c/csswg-drafts/commits/main/css-color-4">changelog</a>]</li>
+<li><a href="https://drafts.csswg.org/css-color-5/">CSS Color Module Level 5</a> [<a href="https://github.com/w3c/csswg-drafts/commits/main/css-color-5">changelog</a>]</li>
+<li><a href="https://drafts.csswg.org/css-color-hdr/">CSS Color HDR Module Level 1</a> [<a href="https://github.com/w3c/csswg-drafts/commits/main/css-color-hdr">changelog</a>]</li>
 </ul>
 <h3>Websites</h3>
 <ul>
-<li>David Briggs's <a href="http://www.huevaluechroma.com/">The Dimensions of Color</a></li>
-<li>Bruce Lindbloom's <a href="http://www.brucelindbloom.com/index.html?Math.html">Useful Color Math</a></li>
-<li>Rune Madsen's <a href="https://programmingdesignsystems.com/">Programming Design Systems</a></li>
+<li>David Briggs’s <a href="http://www.huevaluechroma.com/">The Dimensions of Color</a></li>
+<li>Bruce Lindbloom’s <a href="http://www.brucelindbloom.com/index.html?Math.html">Useful Color Math</a></li>
+<li>Rune Madsen’s <a href="https://programmingdesignsystems.com/">Programming Design Systems</a></li>
 </ul>
 <h3>Articles</h3>
 <ul>