RubyGems - rails_modular_admin - Versions diffs - 0.3.1 → 0.4.0 - Mend

rails_modular_admin 0.3.1 → 0.4.0

Files changed (1416) hide show

data/app/assets/node_modules/tinycolor2/docs/tinycolor.html ADDED Viewed

@@ -0,0 +1,1023 @@
+<!DOCTYPE html>  <html> <head>   <title>tinycolor.js</title>   <meta http-equiv="content-type" content="text/html; charset=UTF-8">   <link rel="stylesheet" media="all" href="docco.css" /> </head> <body>   <div id="container">     <div id="background"></div>          <table cellpadding="0" cellspacing="0">       <thead>         <tr>           <th class="docs">             <h1>               tinycolor.js             </h1>           </th>           <th class="code">           </th>         </tr>       </thead>       <tbody>                               <tr id="section-1">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-1">&#182;</a>               </div>               <p>TinyColor v1.4.1
+https://github.com/bgrins/TinyColor
+Brian Grinstead, MIT License</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nb">Math</span><span class="p">)</span> <span class="p">{</span>
+<span class="kd">var</span> <span class="nx">trimLeft</span> <span class="o">=</span> <span class="sr">/^\s+/</span><span class="p">,</span>
+    <span class="nx">trimRight</span> <span class="o">=</span> <span class="sr">/\s+$/</span><span class="p">,</span>
+    <span class="nx">tinyCounter</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span>
+    <span class="nx">mathRound</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">round</span><span class="p">,</span>
+    <span class="nx">mathMin</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">min</span><span class="p">,</span>
+    <span class="nx">mathMax</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">max</span><span class="p">,</span>
+    <span class="nx">mathRandom</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">random</span><span class="p">;</span>
+<span class="kd">function</span> <span class="nx">tinycolor</span> <span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">opts</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">color</span> <span class="o">=</span> <span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="o">?</span> <span class="nx">color</span> <span class="o">:</span> <span class="s1">&#39;&#39;</span><span class="p">;</span>
+    <span class="nx">opts</span> <span class="o">=</span> <span class="nx">opts</span> <span class="o">||</span> <span class="p">{</span> <span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-2">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-2">&#182;</a>               </div>               <p>If input is already a tinycolor, return itself</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="nx">color</span> <span class="k">instanceof</span> <span class="nx">tinycolor</span><span class="p">)</span> <span class="p">{</span>
+       <span class="k">return</span> <span class="nx">color</span><span class="p">;</span>
+    <span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-3">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-3">&#182;</a>               </div>               <p>If we are called as a function, call using new instead</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="k">this</span> <span class="k">instanceof</span> <span class="nx">tinycolor</span><span class="p">))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">new</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">opts</span><span class="p">);</span>
+    <span class="p">}</span>
+    <span class="kd">var</span> <span class="nx">rgb</span> <span class="o">=</span> <span class="nx">inputToRGB</span><span class="p">(</span><span class="nx">color</span><span class="p">);</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_originalInput</span> <span class="o">=</span> <span class="nx">color</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_r</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_g</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_b</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">a</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="mi">100</span><span class="o">*</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span><span class="p">)</span> <span class="o">/</span> <span class="mi">100</span><span class="p">,</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_format</span> <span class="o">=</span> <span class="nx">opts</span><span class="p">.</span><span class="nx">format</span> <span class="o">||</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">format</span><span class="p">;</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_gradientType</span> <span class="o">=</span> <span class="nx">opts</span><span class="p">.</span><span class="nx">gradientType</span><span class="p">;</span></pre></div>             </td>           </tr>                               <tr id="section-4">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-4">&#182;</a>               </div>               <p>Don't let the range of [0,255] come back in [0,1].
+Potentially lose a little bit of precision here, but will fix issues where
+.5 gets interpreted as half of the total, instead of half of 1
+If it was supposed to be 128, this was already taken care of by <code>inputToRgb</code></p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span> <span class="k">this</span><span class="p">.</span><span class="nx">_r</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">);</span> <span class="p">}</span>
+    <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">);</span> <span class="p">}</span>
+    <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">);</span> <span class="p">}</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_ok</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">ok</span><span class="p">;</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">_tc_id</span> <span class="o">=</span> <span class="nx">tinyCounter</span><span class="o">++</span><span class="p">;</span>
+<span class="p">}</span>
+<span class="nx">tinycolor</span><span class="p">.</span><span class="nx">prototype</span> <span class="o">=</span> <span class="p">{</span>
+    <span class="nx">isDark</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">getBrightness</span><span class="p">()</span> <span class="o">&lt;</span> <span class="mi">128</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">isLight</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">isDark</span><span class="p">();</span>
+    <span class="p">},</span>
+    <span class="nx">isValid</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_ok</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">getOriginalInput</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+      <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_originalInput</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">getFormat</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_format</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">getAlpha</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">getBrightness</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div>             </td>           </tr>                               <tr id="section-5">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-5">&#182;</a>               </div>               <p>http://www.w3.org/TR/AERT#color-contrast</p>             </td>             <td class="code">               <div class="highlight"><pre>        <span class="kd">var</span> <span class="nx">rgb</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toRgb</span><span class="p">();</span>
+        <span class="k">return</span> <span class="p">(</span><span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span> <span class="o">*</span> <span class="mi">299</span> <span class="o">+</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span> <span class="o">*</span> <span class="mi">587</span> <span class="o">+</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span> <span class="o">*</span> <span class="mi">114</span><span class="p">)</span> <span class="o">/</span> <span class="mi">1000</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">getLuminance</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div>             </td>           </tr>                               <tr id="section-6">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-6">&#182;</a>               </div>               <p>http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef</p>             </td>             <td class="code">               <div class="highlight"><pre>        <span class="kd">var</span> <span class="nx">rgb</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toRgb</span><span class="p">();</span>
+        <span class="kd">var</span> <span class="nx">RsRGB</span><span class="p">,</span> <span class="nx">GsRGB</span><span class="p">,</span> <span class="nx">BsRGB</span><span class="p">,</span> <span class="nx">R</span><span class="p">,</span> <span class="nx">G</span><span class="p">,</span> <span class="nx">B</span><span class="p">;</span>
+        <span class="nx">RsRGB</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span><span class="o">/</span><span class="mi">255</span><span class="p">;</span>
+        <span class="nx">GsRGB</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span><span class="o">/</span><span class="mi">255</span><span class="p">;</span>
+        <span class="nx">BsRGB</span> <span class="o">=</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span><span class="o">/</span><span class="mi">255</span><span class="p">;</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">RsRGB</span> <span class="o">&lt;=</span> <span class="mf">0.03928</span><span class="p">)</span> <span class="p">{</span><span class="nx">R</span> <span class="o">=</span> <span class="nx">RsRGB</span> <span class="o">/</span> <span class="mf">12.92</span><span class="p">;}</span> <span class="k">else</span> <span class="p">{</span><span class="nx">R</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">pow</span><span class="p">(((</span><span class="nx">RsRGB</span> <span class="o">+</span> <span class="mf">0.055</span><span class="p">)</span> <span class="o">/</span> <span class="mf">1.055</span><span class="p">),</span> <span class="mf">2.4</span><span class="p">);}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">GsRGB</span> <span class="o">&lt;=</span> <span class="mf">0.03928</span><span class="p">)</span> <span class="p">{</span><span class="nx">G</span> <span class="o">=</span> <span class="nx">GsRGB</span> <span class="o">/</span> <span class="mf">12.92</span><span class="p">;}</span> <span class="k">else</span> <span class="p">{</span><span class="nx">G</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">pow</span><span class="p">(((</span><span class="nx">GsRGB</span> <span class="o">+</span> <span class="mf">0.055</span><span class="p">)</span> <span class="o">/</span> <span class="mf">1.055</span><span class="p">),</span> <span class="mf">2.4</span><span class="p">);}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">BsRGB</span> <span class="o">&lt;=</span> <span class="mf">0.03928</span><span class="p">)</span> <span class="p">{</span><span class="nx">B</span> <span class="o">=</span> <span class="nx">BsRGB</span> <span class="o">/</span> <span class="mf">12.92</span><span class="p">;}</span> <span class="k">else</span> <span class="p">{</span><span class="nx">B</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">pow</span><span class="p">(((</span><span class="nx">BsRGB</span> <span class="o">+</span> <span class="mf">0.055</span><span class="p">)</span> <span class="o">/</span> <span class="mf">1.055</span><span class="p">),</span> <span class="mf">2.4</span><span class="p">);}</span>
+        <span class="k">return</span> <span class="p">(</span><span class="mf">0.2126</span> <span class="o">*</span> <span class="nx">R</span><span class="p">)</span> <span class="o">+</span> <span class="p">(</span><span class="mf">0.7152</span> <span class="o">*</span> <span class="nx">G</span><span class="p">)</span> <span class="o">+</span> <span class="p">(</span><span class="mf">0.0722</span> <span class="o">*</span> <span class="nx">B</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">setAlpha</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">=</span> <span class="nx">boundAlpha</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="mi">100</span><span class="o">*</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span><span class="p">)</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toHsv</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">hsv</span> <span class="o">=</span> <span class="nx">rgbToHsv</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">);</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">h</span> <span class="o">*</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">v</span><span class="o">:</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">v</span><span class="p">,</span> <span class="nx">a</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="p">};</span>
+    <span class="p">},</span>
+    <span class="nx">toHsvString</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">hsv</span> <span class="o">=</span> <span class="nx">rgbToHsv</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">);</span>
+        <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsv</span><span class="p">.</span><span class="nx">h</span> <span class="o">*</span> <span class="mi">360</span><span class="p">),</span> <span class="nx">s</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsv</span><span class="p">.</span><span class="nx">s</span> <span class="o">*</span> <span class="mi">100</span><span class="p">),</span> <span class="nx">v</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsv</span><span class="p">.</span><span class="nx">v</span> <span class="o">*</span> <span class="mi">100</span><span class="p">);</span>
+        <span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="o">?</span>
+          <span class="s2">&quot;hsv(&quot;</span>  <span class="o">+</span> <span class="nx">h</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">s</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">v</span> <span class="o">+</span> <span class="s2">&quot;%)&quot;</span> <span class="o">:</span>
+          <span class="s2">&quot;hsva(&quot;</span> <span class="o">+</span> <span class="nx">h</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">s</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">v</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span><span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toHsl</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">rgbToHsl</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">);</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">*</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span><span class="p">,</span> <span class="nx">a</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="p">};</span>
+    <span class="p">},</span>
+    <span class="nx">toHslString</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">rgbToHsl</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">);</span>
+        <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">*</span> <span class="mi">360</span><span class="p">),</span> <span class="nx">s</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span> <span class="o">*</span> <span class="mi">100</span><span class="p">),</span> <span class="nx">l</span> <span class="o">=</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="o">*</span> <span class="mi">100</span><span class="p">);</span>
+        <span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="o">?</span>
+          <span class="s2">&quot;hsl(&quot;</span>  <span class="o">+</span> <span class="nx">h</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">s</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">l</span> <span class="o">+</span> <span class="s2">&quot;%)&quot;</span> <span class="o">:</span>
+          <span class="s2">&quot;hsla(&quot;</span> <span class="o">+</span> <span class="nx">h</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">s</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">l</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span><span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toHex</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">allow3Char</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">rgbToHex</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="nx">allow3Char</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">toHexString</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">allow3Char</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="s1">&#39;#&#39;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHex</span><span class="p">(</span><span class="nx">allow3Char</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">toHex8</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">allow4Char</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">rgbaToHex</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span><span class="p">,</span> <span class="nx">allow4Char</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">toHex8String</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">allow4Char</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="s1">&#39;#&#39;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHex8</span><span class="p">(</span><span class="nx">allow4Char</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">toRgb</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">),</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">),</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">),</span> <span class="nx">a</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="p">};</span>
+    <span class="p">},</span>
+    <span class="nx">toRgbString</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="o">?</span>
+          <span class="s2">&quot;rgb(&quot;</span>  <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span> <span class="o">:</span>
+          <span class="s2">&quot;rgba(&quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;, &quot;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toPercentageRgb</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%&quot;</span><span class="p">,</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%&quot;</span><span class="p">,</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%&quot;</span><span class="p">,</span> <span class="nx">a</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="p">};</span>
+    <span class="p">},</span>
+    <span class="nx">toPercentageRgbString</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="o">?</span>
+          <span class="s2">&quot;rgb(&quot;</span>  <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%)&quot;</span> <span class="o">:</span>
+          <span class="s2">&quot;rgba(&quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="nx">mathRound</span><span class="p">(</span><span class="nx">bound01</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%, &quot;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">_roundA</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toName</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">return</span> <span class="s2">&quot;transparent&quot;</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="k">return</span> <span class="nx">hexNames</span><span class="p">[</span><span class="nx">rgbToHex</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="kc">true</span><span class="p">)]</span> <span class="o">||</span> <span class="kc">false</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">secondColor</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">hex8String</span> <span class="o">=</span> <span class="s1">&#39;#&#39;</span> <span class="o">+</span> <span class="nx">rgbaToArgbHex</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span><span class="p">);</span>
+        <span class="kd">var</span> <span class="nx">secondHex8String</span> <span class="o">=</span> <span class="nx">hex8String</span><span class="p">;</span>
+        <span class="kd">var</span> <span class="nx">gradientType</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_gradientType</span> <span class="o">?</span> <span class="s2">&quot;GradientType = 1, &quot;</span> <span class="o">:</span> <span class="s2">&quot;&quot;</span><span class="p">;</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">secondColor</span><span class="p">)</span> <span class="p">{</span>
+            <span class="kd">var</span> <span class="nx">s</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">secondColor</span><span class="p">);</span>
+            <span class="nx">secondHex8String</span> <span class="o">=</span> <span class="s1">&#39;#&#39;</span> <span class="o">+</span> <span class="nx">rgbaToArgbHex</span><span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">_r</span><span class="p">,</span> <span class="nx">s</span><span class="p">.</span><span class="nx">_g</span><span class="p">,</span> <span class="nx">s</span><span class="p">.</span><span class="nx">_b</span><span class="p">,</span> <span class="nx">s</span><span class="p">.</span><span class="nx">_a</span><span class="p">);</span>
+        <span class="p">}</span>
+        <span class="k">return</span> <span class="s2">&quot;progid:DXImageTransform.Microsoft.gradient(&quot;</span><span class="o">+</span><span class="nx">gradientType</span><span class="o">+</span><span class="s2">&quot;startColorstr=&quot;</span><span class="o">+</span><span class="nx">hex8String</span><span class="o">+</span><span class="s2">&quot;,endColorstr=&quot;</span><span class="o">+</span><span class="nx">secondHex8String</span><span class="o">+</span><span class="s2">&quot;)&quot;</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">toString</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">format</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">formatSet</span> <span class="o">=</span> <span class="o">!!</span><span class="nx">format</span><span class="p">;</span>
+        <span class="nx">format</span> <span class="o">=</span> <span class="nx">format</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">_format</span><span class="p">;</span>
+        <span class="kd">var</span> <span class="nx">formattedString</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+        <span class="kd">var</span> <span class="nx">hasAlpha</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">&lt;</span> <span class="mi">1</span> <span class="o">&amp;&amp;</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">&gt;=</span> <span class="mi">0</span><span class="p">;</span>
+        <span class="kd">var</span> <span class="nx">needsAlphaFormat</span> <span class="o">=</span> <span class="o">!</span><span class="nx">formatSet</span> <span class="o">&amp;&amp;</span> <span class="nx">hasAlpha</span> <span class="o">&amp;&amp;</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex6&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex3&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex4&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex8&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;name&quot;</span><span class="p">);</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">needsAlphaFormat</span><span class="p">)</span> <span class="p">{</span></pre></div>             </td>           </tr>                               <tr id="section-7">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-7">&#182;</a>               </div>               <p>Special case for "transparent", all other non-alpha formats
+will return rgba when there is transparency.</p>             </td>             <td class="code">               <div class="highlight"><pre>            <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;name&quot;</span> <span class="o">&amp;&amp;</span> <span class="k">this</span><span class="p">.</span><span class="nx">_a</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
+                <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">toName</span><span class="p">();</span>
+            <span class="p">}</span>
+            <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">toRgbString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;rgb&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toRgbString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;prgb&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toPercentageRgbString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex&quot;</span> <span class="o">||</span> <span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex6&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHexString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex3&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHexString</span><span class="p">(</span><span class="kc">true</span><span class="p">);</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex4&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHex8String</span><span class="p">(</span><span class="kc">true</span><span class="p">);</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hex8&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHex8String</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;name&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toName</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hsl&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHslString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s2">&quot;hsv&quot;</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">formattedString</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHsvString</span><span class="p">();</span>
+        <span class="p">}</span>
+        <span class="k">return</span> <span class="nx">formattedString</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">toHexString</span><span class="p">();</span>
+    <span class="p">},</span>
+    <span class="nx">clone</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">toString</span><span class="p">());</span>
+    <span class="p">},</span>
+    <span class="nx">_applyModification</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fn</span><span class="p">,</span> <span class="nx">args</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">color</span> <span class="o">=</span> <span class="nx">fn</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="kc">null</span><span class="p">,</span> <span class="p">[</span><span class="k">this</span><span class="p">].</span><span class="nx">concat</span><span class="p">([].</span><span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nx">args</span><span class="p">)));</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">_r</span> <span class="o">=</span> <span class="nx">color</span><span class="p">.</span><span class="nx">_r</span><span class="p">;</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">_g</span> <span class="o">=</span> <span class="nx">color</span><span class="p">.</span><span class="nx">_g</span><span class="p">;</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">_b</span> <span class="o">=</span> <span class="nx">color</span><span class="p">.</span><span class="nx">_b</span><span class="p">;</span>
+        <span class="k">this</span><span class="p">.</span><span class="nx">setAlpha</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">_a</span><span class="p">);</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">;</span>
+    <span class="p">},</span>
+    <span class="nx">lighten</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">lighten</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">brighten</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">brighten</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">darken</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">darken</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">desaturate</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">desaturate</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">saturate</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">saturate</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">greyscale</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">greyscale</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">spin</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyModification</span><span class="p">(</span><span class="nx">spin</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">_applyCombination</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fn</span><span class="p">,</span> <span class="nx">args</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">fn</span><span class="p">.</span><span class="nx">apply</span><span class="p">(</span><span class="kc">null</span><span class="p">,</span> <span class="p">[</span><span class="k">this</span><span class="p">].</span><span class="nx">concat</span><span class="p">([].</span><span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nx">args</span><span class="p">)));</span>
+    <span class="p">},</span>
+    <span class="nx">analogous</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">analogous</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">complement</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">complement</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">monochromatic</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">monochromatic</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">splitcomplement</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">splitcomplement</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">triad</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">triad</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">},</span>
+    <span class="nx">tetrad</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_applyCombination</span><span class="p">(</span><span class="nx">tetrad</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-8">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-8">&#182;</a>               </div>               <p>If input is an object, force 1 into "1.0" to handle ratios properly
+String input requires "1.0" as input, so 1 will be treated as 1</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">fromRatio</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">opts</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">color</span> <span class="o">==</span> <span class="s2">&quot;object&quot;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">newColor</span> <span class="o">=</span> <span class="p">{};</span>
+        <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">if</span> <span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">i</span><span class="p">))</span> <span class="p">{</span>
+                <span class="k">if</span> <span class="p">(</span><span class="nx">i</span> <span class="o">===</span> <span class="s2">&quot;a&quot;</span><span class="p">)</span> <span class="p">{</span>
+                    <span class="nx">newColor</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">=</span> <span class="nx">color</span><span class="p">[</span><span class="nx">i</span><span class="p">];</span>
+                <span class="p">}</span>
+                <span class="k">else</span> <span class="p">{</span>
+                    <span class="nx">newColor</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">=</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">color</span><span class="p">[</span><span class="nx">i</span><span class="p">]);</span>
+                <span class="p">}</span>
+            <span class="p">}</span>
+        <span class="p">}</span>
+        <span class="nx">color</span> <span class="o">=</span> <span class="nx">newColor</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">opts</span><span class="p">);</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-9">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-9">&#182;</a>               </div>               <p>Given a string or object, convert that input to RGB
+Possible string inputs:</p>
+<pre><code>"red"
+"#f00" or "f00"
+"#ff0000" or "ff0000"
+"#ff000000" or "ff000000"
+"rgb 255 0 0" or "rgb (255, 0, 0)"
+"rgb 1.0 0 0" or "rgb (1, 0, 0)"
+"rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
+"rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
+"hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
+"hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
+"hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
+</code></pre>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">inputToRGB</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">rgb</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">g</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">b</span><span class="o">:</span> <span class="mi">0</span> <span class="p">};</span>
+    <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">s</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">v</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">l</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">ok</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">format</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+    <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">color</span> <span class="o">==</span> <span class="s2">&quot;string&quot;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">color</span> <span class="o">=</span> <span class="nx">stringInputToObject</span><span class="p">(</span><span class="nx">color</span><span class="p">);</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">color</span> <span class="o">==</span> <span class="s2">&quot;object&quot;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">r</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">g</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">b</span><span class="p">))</span> <span class="p">{</span>
+            <span class="nx">rgb</span> <span class="o">=</span> <span class="nx">rgbToRgb</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">r</span><span class="p">,</span> <span class="nx">color</span><span class="p">.</span><span class="nx">g</span><span class="p">,</span> <span class="nx">color</span><span class="p">.</span><span class="nx">b</span><span class="p">);</span>
+            <span class="nx">ok</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
+            <span class="nx">format</span> <span class="o">=</span> <span class="nb">String</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">r</span><span class="p">).</span><span class="nx">substr</span><span class="p">(</span><span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="o">===</span> <span class="s2">&quot;%&quot;</span> <span class="o">?</span> <span class="s2">&quot;prgb&quot;</span> <span class="o">:</span> <span class="s2">&quot;rgb&quot;</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">h</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">s</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">v</span><span class="p">))</span> <span class="p">{</span>
+            <span class="nx">s</span> <span class="o">=</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">s</span><span class="p">);</span>
+            <span class="nx">v</span> <span class="o">=</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">v</span><span class="p">);</span>
+            <span class="nx">rgb</span> <span class="o">=</span> <span class="nx">hsvToRgb</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">v</span><span class="p">);</span>
+            <span class="nx">ok</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
+            <span class="nx">format</span> <span class="o">=</span> <span class="s2">&quot;hsv&quot;</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">h</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">s</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">l</span><span class="p">))</span> <span class="p">{</span>
+            <span class="nx">s</span> <span class="o">=</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">s</span><span class="p">);</span>
+            <span class="nx">l</span> <span class="o">=</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">l</span><span class="p">);</span>
+            <span class="nx">rgb</span> <span class="o">=</span> <span class="nx">hslToRgb</span><span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="p">);</span>
+            <span class="nx">ok</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
+            <span class="nx">format</span> <span class="o">=</span> <span class="s2">&quot;hsl&quot;</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">color</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="s2">&quot;a&quot;</span><span class="p">))</span> <span class="p">{</span>
+            <span class="nx">a</span> <span class="o">=</span> <span class="nx">color</span><span class="p">.</span><span class="nx">a</span><span class="p">;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+    <span class="nx">a</span> <span class="o">=</span> <span class="nx">boundAlpha</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
+    <span class="k">return</span> <span class="p">{</span>
+        <span class="nx">ok</span><span class="o">:</span> <span class="nx">ok</span><span class="p">,</span>
+        <span class="nx">format</span><span class="o">:</span> <span class="nx">color</span><span class="p">.</span><span class="nx">format</span> <span class="o">||</span> <span class="nx">format</span><span class="p">,</span>
+        <span class="nx">r</span><span class="o">:</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">mathMax</span><span class="p">(</span><span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span><span class="p">,</span> <span class="mi">0</span><span class="p">)),</span>
+        <span class="nx">g</span><span class="o">:</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">mathMax</span><span class="p">(</span><span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span><span class="p">,</span> <span class="mi">0</span><span class="p">)),</span>
+        <span class="nx">b</span><span class="o">:</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">mathMax</span><span class="p">(</span><span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span><span class="p">,</span> <span class="mi">0</span><span class="p">)),</span>
+        <span class="nx">a</span><span class="o">:</span> <span class="nx">a</span>
+    <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-10">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-10">&#182;</a>               </div>               <h2>Conversion Functions</h2>             </td>             <td class="code">               <div class="highlight"><pre></pre></div>             </td>           </tr>                               <tr id="section-11">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-11">&#182;</a>               </div>               <p><code>rgbToHsl</code>, <code>rgbToHsv</code>, <code>hslToRgb</code>, <code>hsvToRgb</code> modified from:
+<a href="http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript">http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript</a></p>             </td>             <td class="code">               <div class="highlight"><pre></pre></div>             </td>           </tr>                               <tr id="section-12">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-12">&#182;</a>               </div>               <p><code>rgbToRgb</code>
+Handle bounds / percentage checking to conform to CSS color spec
+<a href="http://www.w3.org/TR/css3-color/">http://www.w3.org/TR/css3-color/</a>
+<em>Assumes:</em> r, g, b in [0, 255] or [0, 1]
+<em>Returns:</em> { r, g, b } in [0, 255]</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbToRgb</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">){</span>
+    <span class="k">return</span> <span class="p">{</span>
+        <span class="nx">r</span><span class="o">:</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span>
+        <span class="nx">g</span><span class="o">:</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">g</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span>
+        <span class="nx">b</span><span class="o">:</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">b</span><span class="p">,</span> <span class="mi">255</span><span class="p">)</span> <span class="o">*</span> <span class="mi">255</span>
+    <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-13">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-13">&#182;</a>               </div>               <p><code>rgbToHsl</code>
+Converts an RGB color value to HSL.
+<em>Assumes:</em> r, g, and b are contained in [0, 255] or [0, 1]
+<em>Returns:</em> { h, s, l } in [0,1]</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbToHsl</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">r</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="nx">g</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">g</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="nx">b</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">b</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">max</span> <span class="o">=</span> <span class="nx">mathMax</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">),</span> <span class="nx">min</span> <span class="o">=</span> <span class="nx">mathMin</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">l</span> <span class="o">=</span> <span class="p">(</span><span class="nx">max</span> <span class="o">+</span> <span class="nx">min</span><span class="p">)</span> <span class="o">/</span> <span class="mi">2</span><span class="p">;</span>
+    <span class="k">if</span><span class="p">(</span><span class="nx">max</span> <span class="o">==</span> <span class="nx">min</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">h</span> <span class="o">=</span> <span class="nx">s</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="c1">// achromatic</span>
+    <span class="p">}</span>
+    <span class="k">else</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">d</span> <span class="o">=</span> <span class="nx">max</span> <span class="o">-</span> <span class="nx">min</span><span class="p">;</span>
+        <span class="nx">s</span> <span class="o">=</span> <span class="nx">l</span> <span class="o">&gt;</span> <span class="mf">0.5</span> <span class="o">?</span> <span class="nx">d</span> <span class="o">/</span> <span class="p">(</span><span class="mi">2</span> <span class="o">-</span> <span class="nx">max</span> <span class="o">-</span> <span class="nx">min</span><span class="p">)</span> <span class="o">:</span> <span class="nx">d</span> <span class="o">/</span> <span class="p">(</span><span class="nx">max</span> <span class="o">+</span> <span class="nx">min</span><span class="p">);</span>
+        <span class="k">switch</span><span class="p">(</span><span class="nx">max</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">case</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">g</span> <span class="o">-</span> <span class="nx">b</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="p">(</span><span class="nx">g</span> <span class="o">&lt;</span> <span class="nx">b</span> <span class="o">?</span> <span class="mi">6</span> <span class="o">:</span> <span class="mi">0</span><span class="p">);</span> <span class="k">break</span><span class="p">;</span>
+            <span class="k">case</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">b</span> <span class="o">-</span> <span class="nx">r</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="mi">2</span><span class="p">;</span> <span class="k">break</span><span class="p">;</span>
+            <span class="k">case</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">r</span> <span class="o">-</span> <span class="nx">g</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="mi">4</span><span class="p">;</span> <span class="k">break</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="nx">h</span> <span class="o">/=</span> <span class="mi">6</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">l</span> <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-14">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-14">&#182;</a>               </div>               <p><code>hslToRgb</code>
+Converts an HSL color value to RGB.
+<em>Assumes:</em> h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100]
+<em>Returns:</em> { r, g, b } in the set [0, 255]</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">hslToRgb</span><span class="p">(</span><span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">;</span>
+    <span class="nx">h</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">h</span><span class="p">,</span> <span class="mi">360</span><span class="p">);</span>
+    <span class="nx">s</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">s</span><span class="p">,</span> <span class="mi">100</span><span class="p">);</span>
+    <span class="nx">l</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">l</span><span class="p">,</span> <span class="mi">100</span><span class="p">);</span>
+    <span class="kd">function</span> <span class="nx">hue2rgb</span><span class="p">(</span><span class="nx">p</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">t</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">if</span><span class="p">(</span><span class="nx">t</span> <span class="o">&lt;</span> <span class="mi">0</span><span class="p">)</span> <span class="nx">t</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
+        <span class="k">if</span><span class="p">(</span><span class="nx">t</span> <span class="o">&gt;</span> <span class="mi">1</span><span class="p">)</span> <span class="nx">t</span> <span class="o">-=</span> <span class="mi">1</span><span class="p">;</span>
+        <span class="k">if</span><span class="p">(</span><span class="nx">t</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="o">/</span><span class="mi">6</span><span class="p">)</span> <span class="k">return</span> <span class="nx">p</span> <span class="o">+</span> <span class="p">(</span><span class="nx">q</span> <span class="o">-</span> <span class="nx">p</span><span class="p">)</span> <span class="o">*</span> <span class="mi">6</span> <span class="o">*</span> <span class="nx">t</span><span class="p">;</span>
+        <span class="k">if</span><span class="p">(</span><span class="nx">t</span> <span class="o">&lt;</span> <span class="mi">1</span><span class="o">/</span><span class="mi">2</span><span class="p">)</span> <span class="k">return</span> <span class="nx">q</span><span class="p">;</span>
+        <span class="k">if</span><span class="p">(</span><span class="nx">t</span> <span class="o">&lt;</span> <span class="mi">2</span><span class="o">/</span><span class="mi">3</span><span class="p">)</span> <span class="k">return</span> <span class="nx">p</span> <span class="o">+</span> <span class="p">(</span><span class="nx">q</span> <span class="o">-</span> <span class="nx">p</span><span class="p">)</span> <span class="o">*</span> <span class="p">(</span><span class="mi">2</span><span class="o">/</span><span class="mi">3</span> <span class="o">-</span> <span class="nx">t</span><span class="p">)</span> <span class="o">*</span> <span class="mi">6</span><span class="p">;</span>
+        <span class="k">return</span> <span class="nx">p</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">if</span><span class="p">(</span><span class="nx">s</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">r</span> <span class="o">=</span> <span class="nx">g</span> <span class="o">=</span> <span class="nx">b</span> <span class="o">=</span> <span class="nx">l</span><span class="p">;</span> <span class="c1">// achromatic</span>
+    <span class="p">}</span>
+    <span class="k">else</span> <span class="p">{</span>
+        <span class="kd">var</span> <span class="nx">q</span> <span class="o">=</span> <span class="nx">l</span> <span class="o">&lt;</span> <span class="mf">0.5</span> <span class="o">?</span> <span class="nx">l</span> <span class="o">*</span> <span class="p">(</span><span class="mi">1</span> <span class="o">+</span> <span class="nx">s</span><span class="p">)</span> <span class="o">:</span> <span class="nx">l</span> <span class="o">+</span> <span class="nx">s</span> <span class="o">-</span> <span class="nx">l</span> <span class="o">*</span> <span class="nx">s</span><span class="p">;</span>
+        <span class="kd">var</span> <span class="nx">p</span> <span class="o">=</span> <span class="mi">2</span> <span class="o">*</span> <span class="nx">l</span> <span class="o">-</span> <span class="nx">q</span><span class="p">;</span>
+        <span class="nx">r</span> <span class="o">=</span> <span class="nx">hue2rgb</span><span class="p">(</span><span class="nx">p</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">h</span> <span class="o">+</span> <span class="mi">1</span><span class="o">/</span><span class="mi">3</span><span class="p">);</span>
+        <span class="nx">g</span> <span class="o">=</span> <span class="nx">hue2rgb</span><span class="p">(</span><span class="nx">p</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">h</span><span class="p">);</span>
+        <span class="nx">b</span> <span class="o">=</span> <span class="nx">hue2rgb</span><span class="p">(</span><span class="nx">p</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">h</span> <span class="o">-</span> <span class="mi">1</span><span class="o">/</span><span class="mi">3</span><span class="p">);</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">r</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">g</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">b</span> <span class="o">*</span> <span class="mi">255</span> <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-15">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-15">&#182;</a>               </div>               <p><code>rgbToHsv</code>
+Converts an RGB color value to HSV
+<em>Assumes:</em> r, g, and b are contained in the set [0, 255] or [0, 1]
+<em>Returns:</em> { h, s, v } in [0,1]</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbToHsv</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">r</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="nx">g</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">g</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="nx">b</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">b</span><span class="p">,</span> <span class="mi">255</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">max</span> <span class="o">=</span> <span class="nx">mathMax</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">),</span> <span class="nx">min</span> <span class="o">=</span> <span class="nx">mathMin</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">v</span> <span class="o">=</span> <span class="nx">max</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">d</span> <span class="o">=</span> <span class="nx">max</span> <span class="o">-</span> <span class="nx">min</span><span class="p">;</span>
+    <span class="nx">s</span> <span class="o">=</span> <span class="nx">max</span> <span class="o">===</span> <span class="mi">0</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="nx">d</span> <span class="o">/</span> <span class="nx">max</span><span class="p">;</span>
+    <span class="k">if</span><span class="p">(</span><span class="nx">max</span> <span class="o">==</span> <span class="nx">min</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">h</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="c1">// achromatic</span>
+    <span class="p">}</span>
+    <span class="k">else</span> <span class="p">{</span>
+        <span class="k">switch</span><span class="p">(</span><span class="nx">max</span><span class="p">)</span> <span class="p">{</span>
+            <span class="k">case</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">g</span> <span class="o">-</span> <span class="nx">b</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="p">(</span><span class="nx">g</span> <span class="o">&lt;</span> <span class="nx">b</span> <span class="o">?</span> <span class="mi">6</span> <span class="o">:</span> <span class="mi">0</span><span class="p">);</span> <span class="k">break</span><span class="p">;</span>
+            <span class="k">case</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">b</span> <span class="o">-</span> <span class="nx">r</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="mi">2</span><span class="p">;</span> <span class="k">break</span><span class="p">;</span>
+            <span class="k">case</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">r</span> <span class="o">-</span> <span class="nx">g</span><span class="p">)</span> <span class="o">/</span> <span class="nx">d</span> <span class="o">+</span> <span class="mi">4</span><span class="p">;</span> <span class="k">break</span><span class="p">;</span>
+        <span class="p">}</span>
+        <span class="nx">h</span> <span class="o">/=</span> <span class="mi">6</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">v</span><span class="o">:</span> <span class="nx">v</span> <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-16">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-16">&#182;</a>               </div>               <p><code>hsvToRgb</code>
+Converts an HSV color value to RGB.
+<em>Assumes:</em> h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
+<em>Returns:</em> { r, g, b } in the set [0, 255]</p>             </td>             <td class="code">               <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">hsvToRgb</span><span class="p">(</span><span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">v</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">h</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">h</span><span class="p">,</span> <span class="mi">360</span><span class="p">)</span> <span class="o">*</span> <span class="mi">6</span><span class="p">;</span>
+    <span class="nx">s</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">s</span><span class="p">,</span> <span class="mi">100</span><span class="p">);</span>
+    <span class="nx">v</span> <span class="o">=</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">v</span><span class="p">,</span> <span class="mi">100</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">floor</span><span class="p">(</span><span class="nx">h</span><span class="p">),</span>
+        <span class="nx">f</span> <span class="o">=</span> <span class="nx">h</span> <span class="o">-</span> <span class="nx">i</span><span class="p">,</span>
+        <span class="nx">p</span> <span class="o">=</span> <span class="nx">v</span> <span class="o">*</span> <span class="p">(</span><span class="mi">1</span> <span class="o">-</span> <span class="nx">s</span><span class="p">),</span>
+        <span class="nx">q</span> <span class="o">=</span> <span class="nx">v</span> <span class="o">*</span> <span class="p">(</span><span class="mi">1</span> <span class="o">-</span> <span class="nx">f</span> <span class="o">*</span> <span class="nx">s</span><span class="p">),</span>
+        <span class="nx">t</span> <span class="o">=</span> <span class="nx">v</span> <span class="o">*</span> <span class="p">(</span><span class="mi">1</span> <span class="o">-</span> <span class="p">(</span><span class="mi">1</span> <span class="o">-</span> <span class="nx">f</span><span class="p">)</span> <span class="o">*</span> <span class="nx">s</span><span class="p">),</span>
+        <span class="nx">mod</span> <span class="o">=</span> <span class="nx">i</span> <span class="o">%</span> <span class="mi">6</span><span class="p">,</span>
+        <span class="nx">r</span> <span class="o">=</span> <span class="p">[</span><span class="nx">v</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">p</span><span class="p">,</span> <span class="nx">p</span><span class="p">,</span> <span class="nx">t</span><span class="p">,</span> <span class="nx">v</span><span class="p">][</span><span class="nx">mod</span><span class="p">],</span>
+        <span class="nx">g</span> <span class="o">=</span> <span class="p">[</span><span class="nx">t</span><span class="p">,</span> <span class="nx">v</span><span class="p">,</span> <span class="nx">v</span><span class="p">,</span> <span class="nx">q</span><span class="p">,</span> <span class="nx">p</span><span class="p">,</span> <span class="nx">p</span><span class="p">][</span><span class="nx">mod</span><span class="p">],</span>
+        <span class="nx">b</span> <span class="o">=</span> <span class="p">[</span><span class="nx">p</span><span class="p">,</span> <span class="nx">p</span><span class="p">,</span> <span class="nx">t</span><span class="p">,</span> <span class="nx">v</span><span class="p">,</span> <span class="nx">v</span><span class="p">,</span> <span class="nx">q</span><span class="p">][</span><span class="nx">mod</span><span class="p">];</span>
+    <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">r</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">g</span> <span class="o">*</span> <span class="mi">255</span><span class="p">,</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">b</span> <span class="o">*</span> <span class="mi">255</span> <span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-17">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-17">&#182;</a>               </div>               <p><code>rgbToHex</code>
+Converts an RGB color to hex
+Assumes r, g, and b are contained in the set [0, 255]
+Returns a 3 or 6 character hex</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbToHex</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">,</span> <span class="nx">allow3Char</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hex</span> <span class="o">=</span> <span class="p">[</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">r</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">g</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">b</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">))</span>
+    <span class="p">];</span></pre></div>             </td>           </tr>                               <tr id="section-18">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-18">&#182;</a>               </div>               <p>Return a 3 character hex if possible</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="nx">allow3Char</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">+</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">+</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">hex</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="s2">&quot;&quot;</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-19">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-19">&#182;</a>               </div>               <p><code>rgbaToHex</code>
+Converts an RGBA color plus alpha transparency to hex
+Assumes r, g, b are contained in the set [0, 255] and
+a in [0, 1]. Returns a 4 or 8 character rgba hex</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbaToHex</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">,</span> <span class="nx">a</span><span class="p">,</span> <span class="nx">allow4Char</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hex</span> <span class="o">=</span> <span class="p">[</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">r</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">g</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">b</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">convertDecimalToHex</span><span class="p">(</span><span class="nx">a</span><span class="p">))</span>
+    <span class="p">];</span></pre></div>             </td>           </tr>                               <tr id="section-20">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-20">&#182;</a>               </div>               <p>Return a 4 character hex if possible</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="nx">allow4Char</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">&amp;&amp;</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">3</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">==</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">3</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">1</span><span class="p">))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">+</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">1</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">+</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">2</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">+</span> <span class="nx">hex</span><span class="p">[</span><span class="mi">3</span><span class="p">].</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">hex</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="s2">&quot;&quot;</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-21">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-21">&#182;</a>               </div>               <p><code>rgbaToArgbHex</code>
+Converts an RGBA color to an ARGB Hex8 string
+Rarely used, but required for "toFilter()"</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">rgbaToArgbHex</span><span class="p">(</span><span class="nx">r</span><span class="p">,</span> <span class="nx">g</span><span class="p">,</span> <span class="nx">b</span><span class="p">,</span> <span class="nx">a</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hex</span> <span class="o">=</span> <span class="p">[</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">convertDecimalToHex</span><span class="p">(</span><span class="nx">a</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">r</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">g</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">)),</span>
+        <span class="nx">pad2</span><span class="p">(</span><span class="nx">mathRound</span><span class="p">(</span><span class="nx">b</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">))</span>
+    <span class="p">];</span>
+    <span class="k">return</span> <span class="nx">hex</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="s2">&quot;&quot;</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-22">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-22">&#182;</a>               </div>               <p><code>equals</code>
+Can be called with any tinycolor input</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">equals</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">color1</span><span class="p">,</span> <span class="nx">color2</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">color1</span> <span class="o">||</span> <span class="o">!</span><span class="nx">color2</span><span class="p">)</span> <span class="p">{</span> <span class="k">return</span> <span class="kc">false</span><span class="p">;</span> <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color1</span><span class="p">).</span><span class="nx">toRgbString</span><span class="p">()</span> <span class="o">==</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color2</span><span class="p">).</span><span class="nx">toRgbString</span><span class="p">();</span>
+<span class="p">};</span>
+<span class="nx">tinycolor</span><span class="p">.</span><span class="nx">random</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">fromRatio</span><span class="p">({</span>
+        <span class="nx">r</span><span class="o">:</span> <span class="nx">mathRandom</span><span class="p">(),</span>
+        <span class="nx">g</span><span class="o">:</span> <span class="nx">mathRandom</span><span class="p">(),</span>
+        <span class="nx">b</span><span class="o">:</span> <span class="nx">mathRandom</span><span class="p">()</span>
+    <span class="p">});</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-23">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-23">&#182;</a>               </div>               <h2>Modification Functions</h2>
+<p>Thanks to less.js for some of the basics here
+<a href="https://github.com/cloudhead/less.js/blob/master/lib/less/functions.js">https://github.com/cloudhead/less.js/blob/master/lib/less/functions.js</a></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">desaturate</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">10</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span> <span class="o">-=</span> <span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span> <span class="o">=</span> <span class="nx">clamp01</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">);</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">saturate</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">10</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span> <span class="o">+=</span> <span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span> <span class="o">=</span> <span class="nx">clamp01</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">);</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">greyscale</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">desaturate</span><span class="p">(</span><span class="mi">100</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">lighten</span> <span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">10</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="o">+=</span> <span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="o">=</span> <span class="nx">clamp01</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span><span class="p">);</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">brighten</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">10</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">rgb</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toRgb</span><span class="p">();</span>
+    <span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span> <span class="o">=</span> <span class="nx">mathMax</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">r</span> <span class="o">-</span> <span class="nx">mathRound</span><span class="p">(</span><span class="mi">255</span> <span class="o">*</span> <span class="o">-</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">))));</span>
+    <span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span> <span class="o">=</span> <span class="nx">mathMax</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">g</span> <span class="o">-</span> <span class="nx">mathRound</span><span class="p">(</span><span class="mi">255</span> <span class="o">*</span> <span class="o">-</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">))));</span>
+    <span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span> <span class="o">=</span> <span class="nx">mathMax</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">255</span><span class="p">,</span> <span class="nx">rgb</span><span class="p">.</span><span class="nx">b</span> <span class="o">-</span> <span class="nx">mathRound</span><span class="p">(</span><span class="mi">255</span> <span class="o">*</span> <span class="o">-</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">))));</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">rgb</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">darken</span> <span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">10</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="o">-=</span> <span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="o">=</span> <span class="nx">clamp01</span><span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span><span class="p">);</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-24">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-24">&#182;</a>               </div>               <p>Spin takes a positive or negative amount within [-360, 360] indicating the change of hue.
+Values outside of this range will be wrapped into this range.</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">spin</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">hue</span> <span class="o">=</span> <span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">+</span> <span class="nx">amount</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">;</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">=</span> <span class="nx">hue</span> <span class="o">&lt;</span> <span class="mi">0</span> <span class="o">?</span> <span class="mi">360</span> <span class="o">+</span> <span class="nx">hue</span> <span class="o">:</span> <span class="nx">hue</span><span class="p">;</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-25">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-25">&#182;</a>               </div>               <h2>Combination Functions</h2>
+<p>Thanks to jQuery xColor for some of the ideas behind these
+<a href="https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js">https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js</a></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">complement</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">180</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">;</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">triad</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span><span class="p">;</span>
+    <span class="k">return</span> <span class="p">[</span>
+        <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">120</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="p">}),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">240</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="p">})</span>
+    <span class="p">];</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">tetrad</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span><span class="p">;</span>
+    <span class="k">return</span> <span class="p">[</span>
+        <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">90</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="p">}),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">180</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="p">}),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">270</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span> <span class="p">})</span>
+    <span class="p">];</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">splitcomplement</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span><span class="p">;</span>
+    <span class="k">return</span> <span class="p">[</span>
+        <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">72</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span><span class="p">}),</span>
+        <span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="p">(</span><span class="nx">h</span> <span class="o">+</span> <span class="mi">216</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">hsl</span><span class="p">.</span><span class="nx">l</span><span class="p">})</span>
+    <span class="p">];</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">analogous</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">results</span><span class="p">,</span> <span class="nx">slices</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">results</span> <span class="o">=</span> <span class="nx">results</span> <span class="o">||</span> <span class="mi">6</span><span class="p">;</span>
+    <span class="nx">slices</span> <span class="o">=</span> <span class="nx">slices</span> <span class="o">||</span> <span class="mi">30</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">hsl</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsl</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">part</span> <span class="o">=</span> <span class="mi">360</span> <span class="o">/</span> <span class="nx">slices</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">ret</span> <span class="o">=</span> <span class="p">[</span><span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">)];</span>
+    <span class="k">for</span> <span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">=</span> <span class="p">((</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">-</span> <span class="p">(</span><span class="nx">part</span> <span class="o">*</span> <span class="nx">results</span> <span class="o">&gt;&gt;</span> <span class="mi">1</span><span class="p">))</span> <span class="o">+</span> <span class="mi">720</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">;</span> <span class="o">--</span><span class="nx">results</span><span class="p">;</span> <span class="p">)</span> <span class="p">{</span>
+        <span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">=</span> <span class="p">(</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">h</span> <span class="o">+</span> <span class="nx">part</span><span class="p">)</span> <span class="o">%</span> <span class="mi">360</span><span class="p">;</span>
+        <span class="nx">ret</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">tinycolor</span><span class="p">(</span><span class="nx">hsl</span><span class="p">));</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">ret</span><span class="p">;</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">monochromatic</span><span class="p">(</span><span class="nx">color</span><span class="p">,</span> <span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">results</span> <span class="o">=</span> <span class="nx">results</span> <span class="o">||</span> <span class="mi">6</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">hsv</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color</span><span class="p">).</span><span class="nx">toHsv</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">h</span> <span class="o">=</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">h</span><span class="p">,</span> <span class="nx">s</span> <span class="o">=</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">s</span><span class="p">,</span> <span class="nx">v</span> <span class="o">=</span> <span class="nx">hsv</span><span class="p">.</span><span class="nx">v</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">ret</span> <span class="o">=</span> <span class="p">[];</span>
+    <span class="kd">var</span> <span class="nx">modification</span> <span class="o">=</span> <span class="mi">1</span> <span class="o">/</span> <span class="nx">results</span><span class="p">;</span>
+    <span class="k">while</span> <span class="p">(</span><span class="nx">results</span><span class="o">--</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">ret</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">tinycolor</span><span class="p">({</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">h</span><span class="p">,</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">s</span><span class="p">,</span> <span class="nx">v</span><span class="o">:</span> <span class="nx">v</span><span class="p">}));</span>
+        <span class="nx">v</span> <span class="o">=</span> <span class="p">(</span><span class="nx">v</span> <span class="o">+</span> <span class="nx">modification</span><span class="p">)</span> <span class="o">%</span> <span class="mi">1</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">ret</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-26">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-26">&#182;</a>               </div>               <h2>Utility Functions</h2>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">mix</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">color1</span><span class="p">,</span> <span class="nx">color2</span><span class="p">,</span> <span class="nx">amount</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">amount</span> <span class="o">=</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="o">?</span> <span class="mi">0</span> <span class="o">:</span> <span class="p">(</span><span class="nx">amount</span> <span class="o">||</span> <span class="mi">50</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">rgb1</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color1</span><span class="p">).</span><span class="nx">toRgb</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">rgb2</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color2</span><span class="p">).</span><span class="nx">toRgb</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">p</span> <span class="o">=</span> <span class="nx">amount</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">rgba</span> <span class="o">=</span> <span class="p">{</span>
+        <span class="nx">r</span><span class="o">:</span> <span class="p">((</span><span class="nx">rgb2</span><span class="p">.</span><span class="nx">r</span> <span class="o">-</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">r</span><span class="p">)</span> <span class="o">*</span> <span class="nx">p</span><span class="p">)</span> <span class="o">+</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">r</span><span class="p">,</span>
+        <span class="nx">g</span><span class="o">:</span> <span class="p">((</span><span class="nx">rgb2</span><span class="p">.</span><span class="nx">g</span> <span class="o">-</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">g</span><span class="p">)</span> <span class="o">*</span> <span class="nx">p</span><span class="p">)</span> <span class="o">+</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">g</span><span class="p">,</span>
+        <span class="nx">b</span><span class="o">:</span> <span class="p">((</span><span class="nx">rgb2</span><span class="p">.</span><span class="nx">b</span> <span class="o">-</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">b</span><span class="p">)</span> <span class="o">*</span> <span class="nx">p</span><span class="p">)</span> <span class="o">+</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">b</span><span class="p">,</span>
+        <span class="nx">a</span><span class="o">:</span> <span class="p">((</span><span class="nx">rgb2</span><span class="p">.</span><span class="nx">a</span> <span class="o">-</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">a</span><span class="p">)</span> <span class="o">*</span> <span class="nx">p</span><span class="p">)</span> <span class="o">+</span> <span class="nx">rgb1</span><span class="p">.</span><span class="nx">a</span>
+    <span class="p">};</span>
+    <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">rgba</span><span class="p">);</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-27">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-27">&#182;</a>               </div>               <h2>Readability Functions</h2>
+<p><http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef (WCAG Version 2)</p>             </td>             <td class="code">               <div class="highlight"><pre></pre></div>             </td>           </tr>                               <tr id="section-28">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-28">&#182;</a>               </div>               <p><code>contrast</code>
+Analyze the 2 colors and returns the color contrast defined by (WCAG Version 2)</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">readability</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">color1</span><span class="p">,</span> <span class="nx">color2</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">c1</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color1</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">c2</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">color2</span><span class="p">);</span>
+    <span class="k">return</span> <span class="p">(</span><span class="nb">Math</span><span class="p">.</span><span class="nx">max</span><span class="p">(</span><span class="nx">c1</span><span class="p">.</span><span class="nx">getLuminance</span><span class="p">(),</span><span class="nx">c2</span><span class="p">.</span><span class="nx">getLuminance</span><span class="p">())</span><span class="o">+</span><span class="mf">0.05</span><span class="p">)</span> <span class="o">/</span> <span class="p">(</span><span class="nb">Math</span><span class="p">.</span><span class="nx">min</span><span class="p">(</span><span class="nx">c1</span><span class="p">.</span><span class="nx">getLuminance</span><span class="p">(),</span><span class="nx">c2</span><span class="p">.</span><span class="nx">getLuminance</span><span class="p">())</span><span class="o">+</span><span class="mf">0.05</span><span class="p">);</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-29">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-29">&#182;</a>               </div>               <p><code>isReadable</code>
+Ensure that foreground and background color combinations meet WCAG2 guidelines.
+The third argument is an optional Object.
+     the 'level' property states 'AA' or 'AAA' - if missing or invalid, it defaults to 'AA';
+     the 'size' property states 'large' or 'small' - if missing or invalid, it defaults to 'small'.
+If the entire object is absent, isReadable defaults to {level:"AA",size:"small"}.</p>             </td>             <td class="code">               <div class="highlight"><pre></pre></div>             </td>           </tr>                               <tr id="section-30">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-30">&#182;</a>               </div>               <p><em>Example</em>
+   tinycolor.isReadable("#000", "#111") => false
+   tinycolor.isReadable("#000", "#111",{level:"AA",size:"large"}) => false</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">isReadable</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">color1</span><span class="p">,</span> <span class="nx">color2</span><span class="p">,</span> <span class="nx">wcag2</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">readability</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">readability</span><span class="p">(</span><span class="nx">color1</span><span class="p">,</span> <span class="nx">color2</span><span class="p">);</span>
+    <span class="kd">var</span> <span class="nx">wcag2Parms</span><span class="p">,</span> <span class="nx">out</span><span class="p">;</span>
+    <span class="nx">out</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+    <span class="nx">wcag2Parms</span> <span class="o">=</span> <span class="nx">validateWCAG2Parms</span><span class="p">(</span><span class="nx">wcag2</span><span class="p">);</span>
+    <span class="k">switch</span> <span class="p">(</span><span class="nx">wcag2Parms</span><span class="p">.</span><span class="nx">level</span> <span class="o">+</span> <span class="nx">wcag2Parms</span><span class="p">.</span><span class="nx">size</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">case</span> <span class="s2">&quot;AAsmall&quot;</span><span class="o">:</span>
+        <span class="k">case</span> <span class="s2">&quot;AAAlarge&quot;</span><span class="o">:</span>
+            <span class="nx">out</span> <span class="o">=</span> <span class="nx">readability</span> <span class="o">&gt;=</span> <span class="mf">4.5</span><span class="p">;</span>
+            <span class="k">break</span><span class="p">;</span>
+        <span class="k">case</span> <span class="s2">&quot;AAlarge&quot;</span><span class="o">:</span>
+            <span class="nx">out</span> <span class="o">=</span> <span class="nx">readability</span> <span class="o">&gt;=</span> <span class="mi">3</span><span class="p">;</span>
+            <span class="k">break</span><span class="p">;</span>
+        <span class="k">case</span> <span class="s2">&quot;AAAsmall&quot;</span><span class="o">:</span>
+            <span class="nx">out</span> <span class="o">=</span> <span class="nx">readability</span> <span class="o">&gt;=</span> <span class="mi">7</span><span class="p">;</span>
+            <span class="k">break</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-31">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-31">&#182;</a>               </div>               <p><code>mostReadable</code>
+Given a base color and a list of possible foreground or background
+colors for that base, returns the most readable color.
+Optionally returns Black or White if the most readable color is unreadable.
+<em>Example</em>
+   tinycolor.mostReadable(tinycolor.mostReadable("#123", ["#124", "#125"],{includeFallbackColors:false}).toHexString(); // "#112255"
+   tinycolor.mostReadable(tinycolor.mostReadable("#123", ["#124", "#125"],{includeFallbackColors:true}).toHexString();  // "#ffffff"
+   tinycolor.mostReadable("#a8015a", ["#faf3f3"],{includeFallbackColors:true,level:"AAA",size:"large"}).toHexString(); // "#faf3f3"
+   tinycolor.mostReadable("#a8015a", ["#faf3f3"],{includeFallbackColors:true,level:"AAA",size:"small"}).toHexString(); // "#ffffff"</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">mostReadable</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">baseColor</span><span class="p">,</span> <span class="nx">colorList</span><span class="p">,</span> <span class="nx">args</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">bestColor</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">bestScore</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">readability</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">includeFallbackColors</span><span class="p">,</span> <span class="nx">level</span><span class="p">,</span> <span class="nx">size</span> <span class="p">;</span>
+    <span class="nx">args</span> <span class="o">=</span> <span class="nx">args</span> <span class="o">||</span> <span class="p">{};</span>
+    <span class="nx">includeFallbackColors</span> <span class="o">=</span> <span class="nx">args</span><span class="p">.</span><span class="nx">includeFallbackColors</span> <span class="p">;</span>
+    <span class="nx">level</span> <span class="o">=</span> <span class="nx">args</span><span class="p">.</span><span class="nx">level</span><span class="p">;</span>
+    <span class="nx">size</span> <span class="o">=</span> <span class="nx">args</span><span class="p">.</span><span class="nx">size</span><span class="p">;</span>
+    <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">colorList</span><span class="p">.</span><span class="nx">length</span> <span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">readability</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">readability</span><span class="p">(</span><span class="nx">baseColor</span><span class="p">,</span> <span class="nx">colorList</span><span class="p">[</span><span class="nx">i</span><span class="p">]);</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">readability</span> <span class="o">&gt;</span> <span class="nx">bestScore</span><span class="p">)</span> <span class="p">{</span>
+            <span class="nx">bestScore</span> <span class="o">=</span> <span class="nx">readability</span><span class="p">;</span>
+            <span class="nx">bestColor</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">(</span><span class="nx">colorList</span><span class="p">[</span><span class="nx">i</span><span class="p">]);</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">tinycolor</span><span class="p">.</span><span class="nx">isReadable</span><span class="p">(</span><span class="nx">baseColor</span><span class="p">,</span> <span class="nx">bestColor</span><span class="p">,</span> <span class="p">{</span><span class="s2">&quot;level&quot;</span><span class="o">:</span><span class="nx">level</span><span class="p">,</span><span class="s2">&quot;size&quot;</span><span class="o">:</span><span class="nx">size</span><span class="p">})</span> <span class="o">||</span> <span class="o">!</span><span class="nx">includeFallbackColors</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="nx">bestColor</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">else</span> <span class="p">{</span>
+        <span class="nx">args</span><span class="p">.</span><span class="nx">includeFallbackColors</span><span class="o">=</span><span class="kc">false</span><span class="p">;</span>
+        <span class="k">return</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">mostReadable</span><span class="p">(</span><span class="nx">baseColor</span><span class="p">,[</span><span class="s2">&quot;#fff&quot;</span><span class="p">,</span> <span class="s2">&quot;#000&quot;</span><span class="p">],</span><span class="nx">args</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-32">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-32">&#182;</a>               </div>               <h2>Big List of Colors</h2>
+<p><a href="http://www.w3.org/TR/css3-color/#svg-color">http://www.w3.org/TR/css3-color/#svg-color</a></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">var</span> <span class="nx">names</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">names</span> <span class="o">=</span> <span class="p">{</span>
+    <span class="nx">aliceblue</span><span class="o">:</span> <span class="s2">&quot;f0f8ff&quot;</span><span class="p">,</span>
+    <span class="nx">antiquewhite</span><span class="o">:</span> <span class="s2">&quot;faebd7&quot;</span><span class="p">,</span>
+    <span class="nx">aqua</span><span class="o">:</span> <span class="s2">&quot;0ff&quot;</span><span class="p">,</span>
+    <span class="nx">aquamarine</span><span class="o">:</span> <span class="s2">&quot;7fffd4&quot;</span><span class="p">,</span>
+    <span class="nx">azure</span><span class="o">:</span> <span class="s2">&quot;f0ffff&quot;</span><span class="p">,</span>
+    <span class="nx">beige</span><span class="o">:</span> <span class="s2">&quot;f5f5dc&quot;</span><span class="p">,</span>
+    <span class="nx">bisque</span><span class="o">:</span> <span class="s2">&quot;ffe4c4&quot;</span><span class="p">,</span>
+    <span class="nx">black</span><span class="o">:</span> <span class="s2">&quot;000&quot;</span><span class="p">,</span>
+    <span class="nx">blanchedalmond</span><span class="o">:</span> <span class="s2">&quot;ffebcd&quot;</span><span class="p">,</span>
+    <span class="nx">blue</span><span class="o">:</span> <span class="s2">&quot;00f&quot;</span><span class="p">,</span>
+    <span class="nx">blueviolet</span><span class="o">:</span> <span class="s2">&quot;8a2be2&quot;</span><span class="p">,</span>
+    <span class="nx">brown</span><span class="o">:</span> <span class="s2">&quot;a52a2a&quot;</span><span class="p">,</span>
+    <span class="nx">burlywood</span><span class="o">:</span> <span class="s2">&quot;deb887&quot;</span><span class="p">,</span>
+    <span class="nx">burntsienna</span><span class="o">:</span> <span class="s2">&quot;ea7e5d&quot;</span><span class="p">,</span>
+    <span class="nx">cadetblue</span><span class="o">:</span> <span class="s2">&quot;5f9ea0&quot;</span><span class="p">,</span>
+    <span class="nx">chartreuse</span><span class="o">:</span> <span class="s2">&quot;7fff00&quot;</span><span class="p">,</span>
+    <span class="nx">chocolate</span><span class="o">:</span> <span class="s2">&quot;d2691e&quot;</span><span class="p">,</span>
+    <span class="nx">coral</span><span class="o">:</span> <span class="s2">&quot;ff7f50&quot;</span><span class="p">,</span>
+    <span class="nx">cornflowerblue</span><span class="o">:</span> <span class="s2">&quot;6495ed&quot;</span><span class="p">,</span>
+    <span class="nx">cornsilk</span><span class="o">:</span> <span class="s2">&quot;fff8dc&quot;</span><span class="p">,</span>
+    <span class="nx">crimson</span><span class="o">:</span> <span class="s2">&quot;dc143c&quot;</span><span class="p">,</span>
+    <span class="nx">cyan</span><span class="o">:</span> <span class="s2">&quot;0ff&quot;</span><span class="p">,</span>
+    <span class="nx">darkblue</span><span class="o">:</span> <span class="s2">&quot;00008b&quot;</span><span class="p">,</span>
+    <span class="nx">darkcyan</span><span class="o">:</span> <span class="s2">&quot;008b8b&quot;</span><span class="p">,</span>
+    <span class="nx">darkgoldenrod</span><span class="o">:</span> <span class="s2">&quot;b8860b&quot;</span><span class="p">,</span>
+    <span class="nx">darkgray</span><span class="o">:</span> <span class="s2">&quot;a9a9a9&quot;</span><span class="p">,</span>
+    <span class="nx">darkgreen</span><span class="o">:</span> <span class="s2">&quot;006400&quot;</span><span class="p">,</span>
+    <span class="nx">darkgrey</span><span class="o">:</span> <span class="s2">&quot;a9a9a9&quot;</span><span class="p">,</span>
+    <span class="nx">darkkhaki</span><span class="o">:</span> <span class="s2">&quot;bdb76b&quot;</span><span class="p">,</span>
+    <span class="nx">darkmagenta</span><span class="o">:</span> <span class="s2">&quot;8b008b&quot;</span><span class="p">,</span>
+    <span class="nx">darkolivegreen</span><span class="o">:</span> <span class="s2">&quot;556b2f&quot;</span><span class="p">,</span>
+    <span class="nx">darkorange</span><span class="o">:</span> <span class="s2">&quot;ff8c00&quot;</span><span class="p">,</span>
+    <span class="nx">darkorchid</span><span class="o">:</span> <span class="s2">&quot;9932cc&quot;</span><span class="p">,</span>
+    <span class="nx">darkred</span><span class="o">:</span> <span class="s2">&quot;8b0000&quot;</span><span class="p">,</span>
+    <span class="nx">darksalmon</span><span class="o">:</span> <span class="s2">&quot;e9967a&quot;</span><span class="p">,</span>
+    <span class="nx">darkseagreen</span><span class="o">:</span> <span class="s2">&quot;8fbc8f&quot;</span><span class="p">,</span>
+    <span class="nx">darkslateblue</span><span class="o">:</span> <span class="s2">&quot;483d8b&quot;</span><span class="p">,</span>
+    <span class="nx">darkslategray</span><span class="o">:</span> <span class="s2">&quot;2f4f4f&quot;</span><span class="p">,</span>
+    <span class="nx">darkslategrey</span><span class="o">:</span> <span class="s2">&quot;2f4f4f&quot;</span><span class="p">,</span>
+    <span class="nx">darkturquoise</span><span class="o">:</span> <span class="s2">&quot;00ced1&quot;</span><span class="p">,</span>
+    <span class="nx">darkviolet</span><span class="o">:</span> <span class="s2">&quot;9400d3&quot;</span><span class="p">,</span>
+    <span class="nx">deeppink</span><span class="o">:</span> <span class="s2">&quot;ff1493&quot;</span><span class="p">,</span>
+    <span class="nx">deepskyblue</span><span class="o">:</span> <span class="s2">&quot;00bfff&quot;</span><span class="p">,</span>
+    <span class="nx">dimgray</span><span class="o">:</span> <span class="s2">&quot;696969&quot;</span><span class="p">,</span>
+    <span class="nx">dimgrey</span><span class="o">:</span> <span class="s2">&quot;696969&quot;</span><span class="p">,</span>
+    <span class="nx">dodgerblue</span><span class="o">:</span> <span class="s2">&quot;1e90ff&quot;</span><span class="p">,</span>
+    <span class="nx">firebrick</span><span class="o">:</span> <span class="s2">&quot;b22222&quot;</span><span class="p">,</span>
+    <span class="nx">floralwhite</span><span class="o">:</span> <span class="s2">&quot;fffaf0&quot;</span><span class="p">,</span>
+    <span class="nx">forestgreen</span><span class="o">:</span> <span class="s2">&quot;228b22&quot;</span><span class="p">,</span>
+    <span class="nx">fuchsia</span><span class="o">:</span> <span class="s2">&quot;f0f&quot;</span><span class="p">,</span>
+    <span class="nx">gainsboro</span><span class="o">:</span> <span class="s2">&quot;dcdcdc&quot;</span><span class="p">,</span>
+    <span class="nx">ghostwhite</span><span class="o">:</span> <span class="s2">&quot;f8f8ff&quot;</span><span class="p">,</span>
+    <span class="nx">gold</span><span class="o">:</span> <span class="s2">&quot;ffd700&quot;</span><span class="p">,</span>
+    <span class="nx">goldenrod</span><span class="o">:</span> <span class="s2">&quot;daa520&quot;</span><span class="p">,</span>
+    <span class="nx">gray</span><span class="o">:</span> <span class="s2">&quot;808080&quot;</span><span class="p">,</span>
+    <span class="nx">green</span><span class="o">:</span> <span class="s2">&quot;008000&quot;</span><span class="p">,</span>
+    <span class="nx">greenyellow</span><span class="o">:</span> <span class="s2">&quot;adff2f&quot;</span><span class="p">,</span>
+    <span class="nx">grey</span><span class="o">:</span> <span class="s2">&quot;808080&quot;</span><span class="p">,</span>
+    <span class="nx">honeydew</span><span class="o">:</span> <span class="s2">&quot;f0fff0&quot;</span><span class="p">,</span>
+    <span class="nx">hotpink</span><span class="o">:</span> <span class="s2">&quot;ff69b4&quot;</span><span class="p">,</span>
+    <span class="nx">indianred</span><span class="o">:</span> <span class="s2">&quot;cd5c5c&quot;</span><span class="p">,</span>
+    <span class="nx">indigo</span><span class="o">:</span> <span class="s2">&quot;4b0082&quot;</span><span class="p">,</span>
+    <span class="nx">ivory</span><span class="o">:</span> <span class="s2">&quot;fffff0&quot;</span><span class="p">,</span>
+    <span class="nx">khaki</span><span class="o">:</span> <span class="s2">&quot;f0e68c&quot;</span><span class="p">,</span>
+    <span class="nx">lavender</span><span class="o">:</span> <span class="s2">&quot;e6e6fa&quot;</span><span class="p">,</span>
+    <span class="nx">lavenderblush</span><span class="o">:</span> <span class="s2">&quot;fff0f5&quot;</span><span class="p">,</span>
+    <span class="nx">lawngreen</span><span class="o">:</span> <span class="s2">&quot;7cfc00&quot;</span><span class="p">,</span>
+    <span class="nx">lemonchiffon</span><span class="o">:</span> <span class="s2">&quot;fffacd&quot;</span><span class="p">,</span>
+    <span class="nx">lightblue</span><span class="o">:</span> <span class="s2">&quot;add8e6&quot;</span><span class="p">,</span>
+    <span class="nx">lightcoral</span><span class="o">:</span> <span class="s2">&quot;f08080&quot;</span><span class="p">,</span>
+    <span class="nx">lightcyan</span><span class="o">:</span> <span class="s2">&quot;e0ffff&quot;</span><span class="p">,</span>
+    <span class="nx">lightgoldenrodyellow</span><span class="o">:</span> <span class="s2">&quot;fafad2&quot;</span><span class="p">,</span>
+    <span class="nx">lightgray</span><span class="o">:</span> <span class="s2">&quot;d3d3d3&quot;</span><span class="p">,</span>
+    <span class="nx">lightgreen</span><span class="o">:</span> <span class="s2">&quot;90ee90&quot;</span><span class="p">,</span>
+    <span class="nx">lightgrey</span><span class="o">:</span> <span class="s2">&quot;d3d3d3&quot;</span><span class="p">,</span>
+    <span class="nx">lightpink</span><span class="o">:</span> <span class="s2">&quot;ffb6c1&quot;</span><span class="p">,</span>
+    <span class="nx">lightsalmon</span><span class="o">:</span> <span class="s2">&quot;ffa07a&quot;</span><span class="p">,</span>
+    <span class="nx">lightseagreen</span><span class="o">:</span> <span class="s2">&quot;20b2aa&quot;</span><span class="p">,</span>
+    <span class="nx">lightskyblue</span><span class="o">:</span> <span class="s2">&quot;87cefa&quot;</span><span class="p">,</span>
+    <span class="nx">lightslategray</span><span class="o">:</span> <span class="s2">&quot;789&quot;</span><span class="p">,</span>
+    <span class="nx">lightslategrey</span><span class="o">:</span> <span class="s2">&quot;789&quot;</span><span class="p">,</span>
+    <span class="nx">lightsteelblue</span><span class="o">:</span> <span class="s2">&quot;b0c4de&quot;</span><span class="p">,</span>
+    <span class="nx">lightyellow</span><span class="o">:</span> <span class="s2">&quot;ffffe0&quot;</span><span class="p">,</span>
+    <span class="nx">lime</span><span class="o">:</span> <span class="s2">&quot;0f0&quot;</span><span class="p">,</span>
+    <span class="nx">limegreen</span><span class="o">:</span> <span class="s2">&quot;32cd32&quot;</span><span class="p">,</span>
+    <span class="nx">linen</span><span class="o">:</span> <span class="s2">&quot;faf0e6&quot;</span><span class="p">,</span>
+    <span class="nx">magenta</span><span class="o">:</span> <span class="s2">&quot;f0f&quot;</span><span class="p">,</span>
+    <span class="nx">maroon</span><span class="o">:</span> <span class="s2">&quot;800000&quot;</span><span class="p">,</span>
+    <span class="nx">mediumaquamarine</span><span class="o">:</span> <span class="s2">&quot;66cdaa&quot;</span><span class="p">,</span>
+    <span class="nx">mediumblue</span><span class="o">:</span> <span class="s2">&quot;0000cd&quot;</span><span class="p">,</span>
+    <span class="nx">mediumorchid</span><span class="o">:</span> <span class="s2">&quot;ba55d3&quot;</span><span class="p">,</span>
+    <span class="nx">mediumpurple</span><span class="o">:</span> <span class="s2">&quot;9370db&quot;</span><span class="p">,</span>
+    <span class="nx">mediumseagreen</span><span class="o">:</span> <span class="s2">&quot;3cb371&quot;</span><span class="p">,</span>
+    <span class="nx">mediumslateblue</span><span class="o">:</span> <span class="s2">&quot;7b68ee&quot;</span><span class="p">,</span>
+    <span class="nx">mediumspringgreen</span><span class="o">:</span> <span class="s2">&quot;00fa9a&quot;</span><span class="p">,</span>
+    <span class="nx">mediumturquoise</span><span class="o">:</span> <span class="s2">&quot;48d1cc&quot;</span><span class="p">,</span>
+    <span class="nx">mediumvioletred</span><span class="o">:</span> <span class="s2">&quot;c71585&quot;</span><span class="p">,</span>
+    <span class="nx">midnightblue</span><span class="o">:</span> <span class="s2">&quot;191970&quot;</span><span class="p">,</span>
+    <span class="nx">mintcream</span><span class="o">:</span> <span class="s2">&quot;f5fffa&quot;</span><span class="p">,</span>
+    <span class="nx">mistyrose</span><span class="o">:</span> <span class="s2">&quot;ffe4e1&quot;</span><span class="p">,</span>
+    <span class="nx">moccasin</span><span class="o">:</span> <span class="s2">&quot;ffe4b5&quot;</span><span class="p">,</span>
+    <span class="nx">navajowhite</span><span class="o">:</span> <span class="s2">&quot;ffdead&quot;</span><span class="p">,</span>
+    <span class="nx">navy</span><span class="o">:</span> <span class="s2">&quot;000080&quot;</span><span class="p">,</span>
+    <span class="nx">oldlace</span><span class="o">:</span> <span class="s2">&quot;fdf5e6&quot;</span><span class="p">,</span>
+    <span class="nx">olive</span><span class="o">:</span> <span class="s2">&quot;808000&quot;</span><span class="p">,</span>
+    <span class="nx">olivedrab</span><span class="o">:</span> <span class="s2">&quot;6b8e23&quot;</span><span class="p">,</span>
+    <span class="nx">orange</span><span class="o">:</span> <span class="s2">&quot;ffa500&quot;</span><span class="p">,</span>
+    <span class="nx">orangered</span><span class="o">:</span> <span class="s2">&quot;ff4500&quot;</span><span class="p">,</span>
+    <span class="nx">orchid</span><span class="o">:</span> <span class="s2">&quot;da70d6&quot;</span><span class="p">,</span>
+    <span class="nx">palegoldenrod</span><span class="o">:</span> <span class="s2">&quot;eee8aa&quot;</span><span class="p">,</span>
+    <span class="nx">palegreen</span><span class="o">:</span> <span class="s2">&quot;98fb98&quot;</span><span class="p">,</span>
+    <span class="nx">paleturquoise</span><span class="o">:</span> <span class="s2">&quot;afeeee&quot;</span><span class="p">,</span>
+    <span class="nx">palevioletred</span><span class="o">:</span> <span class="s2">&quot;db7093&quot;</span><span class="p">,</span>
+    <span class="nx">papayawhip</span><span class="o">:</span> <span class="s2">&quot;ffefd5&quot;</span><span class="p">,</span>
+    <span class="nx">peachpuff</span><span class="o">:</span> <span class="s2">&quot;ffdab9&quot;</span><span class="p">,</span>
+    <span class="nx">peru</span><span class="o">:</span> <span class="s2">&quot;cd853f&quot;</span><span class="p">,</span>
+    <span class="nx">pink</span><span class="o">:</span> <span class="s2">&quot;ffc0cb&quot;</span><span class="p">,</span>
+    <span class="nx">plum</span><span class="o">:</span> <span class="s2">&quot;dda0dd&quot;</span><span class="p">,</span>
+    <span class="nx">powderblue</span><span class="o">:</span> <span class="s2">&quot;b0e0e6&quot;</span><span class="p">,</span>
+    <span class="nx">purple</span><span class="o">:</span> <span class="s2">&quot;800080&quot;</span><span class="p">,</span>
+    <span class="nx">rebeccapurple</span><span class="o">:</span> <span class="s2">&quot;663399&quot;</span><span class="p">,</span>
+    <span class="nx">red</span><span class="o">:</span> <span class="s2">&quot;f00&quot;</span><span class="p">,</span>
+    <span class="nx">rosybrown</span><span class="o">:</span> <span class="s2">&quot;bc8f8f&quot;</span><span class="p">,</span>
+    <span class="nx">royalblue</span><span class="o">:</span> <span class="s2">&quot;4169e1&quot;</span><span class="p">,</span>
+    <span class="nx">saddlebrown</span><span class="o">:</span> <span class="s2">&quot;8b4513&quot;</span><span class="p">,</span>
+    <span class="nx">salmon</span><span class="o">:</span> <span class="s2">&quot;fa8072&quot;</span><span class="p">,</span>
+    <span class="nx">sandybrown</span><span class="o">:</span> <span class="s2">&quot;f4a460&quot;</span><span class="p">,</span>
+    <span class="nx">seagreen</span><span class="o">:</span> <span class="s2">&quot;2e8b57&quot;</span><span class="p">,</span>
+    <span class="nx">seashell</span><span class="o">:</span> <span class="s2">&quot;fff5ee&quot;</span><span class="p">,</span>
+    <span class="nx">sienna</span><span class="o">:</span> <span class="s2">&quot;a0522d&quot;</span><span class="p">,</span>
+    <span class="nx">silver</span><span class="o">:</span> <span class="s2">&quot;c0c0c0&quot;</span><span class="p">,</span>
+    <span class="nx">skyblue</span><span class="o">:</span> <span class="s2">&quot;87ceeb&quot;</span><span class="p">,</span>
+    <span class="nx">slateblue</span><span class="o">:</span> <span class="s2">&quot;6a5acd&quot;</span><span class="p">,</span>
+    <span class="nx">slategray</span><span class="o">:</span> <span class="s2">&quot;708090&quot;</span><span class="p">,</span>
+    <span class="nx">slategrey</span><span class="o">:</span> <span class="s2">&quot;708090&quot;</span><span class="p">,</span>
+    <span class="nx">snow</span><span class="o">:</span> <span class="s2">&quot;fffafa&quot;</span><span class="p">,</span>
+    <span class="nx">springgreen</span><span class="o">:</span> <span class="s2">&quot;00ff7f&quot;</span><span class="p">,</span>
+    <span class="nx">steelblue</span><span class="o">:</span> <span class="s2">&quot;4682b4&quot;</span><span class="p">,</span>
+    <span class="nx">tan</span><span class="o">:</span> <span class="s2">&quot;d2b48c&quot;</span><span class="p">,</span>
+    <span class="nx">teal</span><span class="o">:</span> <span class="s2">&quot;008080&quot;</span><span class="p">,</span>
+    <span class="nx">thistle</span><span class="o">:</span> <span class="s2">&quot;d8bfd8&quot;</span><span class="p">,</span>
+    <span class="nx">tomato</span><span class="o">:</span> <span class="s2">&quot;ff6347&quot;</span><span class="p">,</span>
+    <span class="nx">turquoise</span><span class="o">:</span> <span class="s2">&quot;40e0d0&quot;</span><span class="p">,</span>
+    <span class="nx">violet</span><span class="o">:</span> <span class="s2">&quot;ee82ee&quot;</span><span class="p">,</span>
+    <span class="nx">wheat</span><span class="o">:</span> <span class="s2">&quot;f5deb3&quot;</span><span class="p">,</span>
+    <span class="nx">white</span><span class="o">:</span> <span class="s2">&quot;fff&quot;</span><span class="p">,</span>
+    <span class="nx">whitesmoke</span><span class="o">:</span> <span class="s2">&quot;f5f5f5&quot;</span><span class="p">,</span>
+    <span class="nx">yellow</span><span class="o">:</span> <span class="s2">&quot;ff0&quot;</span><span class="p">,</span>
+    <span class="nx">yellowgreen</span><span class="o">:</span> <span class="s2">&quot;9acd32&quot;</span>
+<span class="p">};</span></pre></div>             </td>           </tr>                               <tr id="section-33">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-33">&#182;</a>               </div>               <p>Make it easy to access colors via <code>hexNames[hex]</code></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">var</span> <span class="nx">hexNames</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">.</span><span class="nx">hexNames</span> <span class="o">=</span> <span class="nx">flip</span><span class="p">(</span><span class="nx">names</span><span class="p">);</span></pre></div>             </td>           </tr>                               <tr id="section-34">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-34">&#182;</a>               </div>               <h2>Utilities</h2>             </td>             <td class="code">               <div class="highlight"><pre></pre></div>             </td>           </tr>                               <tr id="section-35">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-35">&#182;</a>               </div>               <p><code>{ 'name1': 'val1' }</code> becomes <code>{ 'val1': 'name1' }</code></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">flip</span><span class="p">(</span><span class="nx">o</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kd">var</span> <span class="nx">flipped</span> <span class="o">=</span> <span class="p">{</span> <span class="p">};</span>
+    <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">o</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">if</span> <span class="p">(</span><span class="nx">o</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">i</span><span class="p">))</span> <span class="p">{</span>
+            <span class="nx">flipped</span><span class="p">[</span><span class="nx">o</span><span class="p">[</span><span class="nx">i</span><span class="p">]]</span> <span class="o">=</span> <span class="nx">i</span><span class="p">;</span>
+        <span class="p">}</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">flipped</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-36">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-36">&#182;</a>               </div>               <p>Return a valid alpha value [0,1] with all invalid values being set to 1</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">boundAlpha</span><span class="p">(</span><span class="nx">a</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">a</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nb">isNaN</span><span class="p">(</span><span class="nx">a</span><span class="p">)</span> <span class="o">||</span> <span class="nx">a</span> <span class="o">&lt;</span> <span class="mi">0</span> <span class="o">||</span> <span class="nx">a</span> <span class="o">&gt;</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">a</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">a</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-37">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-37">&#182;</a>               </div>               <p>Take input from [0, n] and return it as [0, 1]</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">bound01</span><span class="p">(</span><span class="nx">n</span><span class="p">,</span> <span class="nx">max</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">isOnePointZero</span><span class="p">(</span><span class="nx">n</span><span class="p">))</span> <span class="p">{</span> <span class="nx">n</span> <span class="o">=</span> <span class="s2">&quot;100%&quot;</span><span class="p">;</span> <span class="p">}</span>
+    <span class="kd">var</span> <span class="nx">processPercent</span> <span class="o">=</span> <span class="nx">isPercentage</span><span class="p">(</span><span class="nx">n</span><span class="p">);</span>
+    <span class="nx">n</span> <span class="o">=</span> <span class="nx">mathMin</span><span class="p">(</span><span class="nx">max</span><span class="p">,</span> <span class="nx">mathMax</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">n</span><span class="p">)));</span></pre></div>             </td>           </tr>                               <tr id="section-38">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-38">&#182;</a>               </div>               <p>Automatically convert percentage into number</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">(</span><span class="nx">processPercent</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">n</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">n</span> <span class="o">*</span> <span class="nx">max</span><span class="p">,</span> <span class="mi">10</span><span class="p">)</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
+    <span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-39">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-39">&#182;</a>               </div>               <p>Handle floating point rounding errors</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">if</span> <span class="p">((</span><span class="nb">Math</span><span class="p">.</span><span class="nx">abs</span><span class="p">(</span><span class="nx">n</span> <span class="o">-</span> <span class="nx">max</span><span class="p">)</span> <span class="o">&lt;</span> <span class="mf">0.000001</span><span class="p">))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="mi">1</span><span class="p">;</span>
+    <span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-40">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-40">&#182;</a>               </div>               <p>Convert into [0, 1] range if it isn't already</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="k">return</span> <span class="p">(</span><span class="nx">n</span> <span class="o">%</span> <span class="nx">max</span><span class="p">)</span> <span class="o">/</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">max</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-41">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-41">&#182;</a>               </div>               <p>Force a number between 0 and 1</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">clamp01</span><span class="p">(</span><span class="nx">val</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">mathMin</span><span class="p">(</span><span class="mi">1</span><span class="p">,</span> <span class="nx">mathMax</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">val</span><span class="p">));</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-42">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-42">&#182;</a>               </div>               <p>Parse a base-16 hex value into a base-10 integer</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">val</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="mi">16</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-43">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-43">&#182;</a>               </div>               <p>Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1
+<a href="http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0">http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0</a></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">isOnePointZero</span><span class="p">(</span><span class="nx">n</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="k">typeof</span> <span class="nx">n</span> <span class="o">==</span> <span class="s2">&quot;string&quot;</span> <span class="o">&amp;&amp;</span> <span class="nx">n</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s1">&#39;.&#39;</span><span class="p">)</span> <span class="o">!=</span> <span class="o">-</span><span class="mi">1</span> <span class="o">&amp;&amp;</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">n</span><span class="p">)</span> <span class="o">===</span> <span class="mi">1</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-44">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-44">&#182;</a>               </div>               <p>Check to see if string passed in is a percentage</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">isPercentage</span><span class="p">(</span><span class="nx">n</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="k">typeof</span> <span class="nx">n</span> <span class="o">===</span> <span class="s2">&quot;string&quot;</span> <span class="o">&amp;&amp;</span> <span class="nx">n</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s1">&#39;%&#39;</span><span class="p">)</span> <span class="o">!=</span> <span class="o">-</span><span class="mi">1</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-45">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-45">&#182;</a>               </div>               <p>Force a hex value to have 2 characters</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">pad2</span><span class="p">(</span><span class="nx">c</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nx">c</span><span class="p">.</span><span class="nx">length</span> <span class="o">==</span> <span class="mi">1</span> <span class="o">?</span> <span class="s1">&#39;0&#39;</span> <span class="o">+</span> <span class="nx">c</span> <span class="o">:</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">c</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-46">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-46">&#182;</a>               </div>               <p>Replace a decimal with it's percentage value</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">convertToPercentage</span><span class="p">(</span><span class="nx">n</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">n</span> <span class="o">&lt;=</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">n</span> <span class="o">=</span> <span class="p">(</span><span class="nx">n</span> <span class="o">*</span> <span class="mi">100</span><span class="p">)</span> <span class="o">+</span> <span class="s2">&quot;%&quot;</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="nx">n</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-47">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-47">&#182;</a>               </div>               <p>Converts a decimal to a hex value</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">convertDecimalToHex</span><span class="p">(</span><span class="nx">d</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">round</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">d</span><span class="p">)</span> <span class="o">*</span> <span class="mi">255</span><span class="p">).</span><span class="nx">toString</span><span class="p">(</span><span class="mi">16</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-48">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-48">&#182;</a>               </div>               <p>Converts a hex value to a decimal</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">convertHexToDecimal</span><span class="p">(</span><span class="nx">h</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="p">(</span><span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">h</span><span class="p">)</span> <span class="o">/</span> <span class="mi">255</span><span class="p">);</span>
+<span class="p">}</span>
+<span class="kd">var</span> <span class="nx">matchers</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div>             </td>           </tr>                               <tr id="section-49">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-49">&#182;</a>               </div>               <p><a href="http://www.w3.org/TR/css3-values/#integers">http://www.w3.org/TR/css3-values/#integers</a></p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">CSS_INTEGER</span> <span class="o">=</span> <span class="s2">&quot;[-\\+]?\\d+%?&quot;</span><span class="p">;</span></pre></div>             </td>           </tr>                               <tr id="section-50">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-50">&#182;</a>               </div>               <p><a href="http://www.w3.org/TR/css3-values/#number-value">http://www.w3.org/TR/css3-values/#number-value</a></p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">CSS_NUMBER</span> <span class="o">=</span> <span class="s2">&quot;[-\\+]?\\d*\\.\\d+%?&quot;</span><span class="p">;</span></pre></div>             </td>           </tr>                               <tr id="section-51">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-51">&#182;</a>               </div>               <p>Allow positive/negative integer/number.  Don't capture the either/or, just the entire outcome.</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">CSS_UNIT</span> <span class="o">=</span> <span class="s2">&quot;(?:&quot;</span> <span class="o">+</span> <span class="nx">CSS_NUMBER</span> <span class="o">+</span> <span class="s2">&quot;)|(?:&quot;</span> <span class="o">+</span> <span class="nx">CSS_INTEGER</span> <span class="o">+</span> <span class="s2">&quot;)&quot;</span><span class="p">;</span></pre></div>             </td>           </tr>                               <tr id="section-52">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-52">&#182;</a>               </div>               <p>Actual matching.
+Parentheses and commas are optional, but not required.
+Whitespace can take the place of commas or opening paren</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">PERMISSIVE_MATCH3</span> <span class="o">=</span> <span class="s2">&quot;[\\s|\\(]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)[,|\\s]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)[,|\\s]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)\\s*\\)?&quot;</span><span class="p">;</span>
+    <span class="kd">var</span> <span class="nx">PERMISSIVE_MATCH4</span> <span class="o">=</span> <span class="s2">&quot;[\\s|\\(]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)[,|\\s]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)[,|\\s]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)[,|\\s]+(&quot;</span> <span class="o">+</span> <span class="nx">CSS_UNIT</span> <span class="o">+</span> <span class="s2">&quot;)\\s*\\)?&quot;</span><span class="p">;</span>
+    <span class="k">return</span> <span class="p">{</span>
+        <span class="nx">CSS_UNIT</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="nx">CSS_UNIT</span><span class="p">),</span>
+        <span class="nx">rgb</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;rgb&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH3</span><span class="p">),</span>
+        <span class="nx">rgba</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;rgba&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH4</span><span class="p">),</span>
+        <span class="nx">hsl</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;hsl&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH3</span><span class="p">),</span>
+        <span class="nx">hsla</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;hsla&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH4</span><span class="p">),</span>
+        <span class="nx">hsv</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;hsv&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH3</span><span class="p">),</span>
+        <span class="nx">hsva</span><span class="o">:</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">&quot;hsva&quot;</span> <span class="o">+</span> <span class="nx">PERMISSIVE_MATCH4</span><span class="p">),</span>
+        <span class="nx">hex3</span><span class="o">:</span> <span class="sr">/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/</span><span class="p">,</span>
+        <span class="nx">hex6</span><span class="o">:</span> <span class="sr">/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/</span><span class="p">,</span>
+        <span class="nx">hex4</span><span class="o">:</span> <span class="sr">/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/</span><span class="p">,</span>
+        <span class="nx">hex8</span><span class="o">:</span> <span class="sr">/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/</span>
+    <span class="p">};</span>
+<span class="p">})();</span></pre></div>             </td>           </tr>                               <tr id="section-53">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-53">&#182;</a>               </div>               <p><code>isValidCSSUnit</code>
+Take in a single string / number and check to see if it looks like a CSS unit
+(see <code>matchers</code> above for definition).</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">isValidCSSUnit</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="o">!!</span><span class="nx">matchers</span><span class="p">.</span><span class="nx">CSS_UNIT</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">);</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-54">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-54">&#182;</a>               </div>               <p><code>stringInputToObject</code>
+Permissive string parsing.  Take in a number of formats, and output an object
+based on detected format.  Returns <code>{ r, g, b }</code> or <code>{ h, s, l }</code> or <code>{ h, s, v}</code></p>             </td>             <td class="code">               <div class="highlight"><pre><span class="kd">function</span> <span class="nx">stringInputToObject</span><span class="p">(</span><span class="nx">color</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">color</span> <span class="o">=</span> <span class="nx">color</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">trimLeft</span><span class="p">,</span><span class="s1">&#39;&#39;</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="nx">trimRight</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">).</span><span class="nx">toLowerCase</span><span class="p">();</span>
+    <span class="kd">var</span> <span class="nx">named</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">names</span><span class="p">[</span><span class="nx">color</span><span class="p">])</span> <span class="p">{</span>
+        <span class="nx">color</span> <span class="o">=</span> <span class="nx">names</span><span class="p">[</span><span class="nx">color</span><span class="p">];</span>
+        <span class="nx">named</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">color</span> <span class="o">==</span> <span class="s1">&#39;transparent&#39;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">g</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">b</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">a</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span> <span class="nx">format</span><span class="o">:</span> <span class="s2">&quot;name&quot;</span> <span class="p">};</span>
+    <span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-55">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-55">&#182;</a>               </div>               <p>Try to match string input using regular expressions.
+Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]
+Just return an object and let the conversion functions handle that.
+This way the result will be the same whether the tinycolor is initialized with string or object.</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">match</span><span class="p">;</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">rgb</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">rgba</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">r</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">g</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">b</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">],</span> <span class="nx">a</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hsl</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hsla</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">l</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">],</span> <span class="nx">a</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hsv</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">v</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hsva</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span> <span class="nx">h</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="nx">s</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="nx">v</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">],</span> <span class="nx">a</span><span class="o">:</span> <span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]</span> <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hex8</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span>
+            <span class="nx">r</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]),</span>
+            <span class="nx">g</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]),</span>
+            <span class="nx">b</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]),</span>
+            <span class="nx">a</span><span class="o">:</span> <span class="nx">convertHexToDecimal</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]),</span>
+            <span class="nx">format</span><span class="o">:</span> <span class="nx">named</span> <span class="o">?</span> <span class="s2">&quot;name&quot;</span> <span class="o">:</span> <span class="s2">&quot;hex8&quot;</span>
+        <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hex6</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span>
+            <span class="nx">r</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]),</span>
+            <span class="nx">g</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]),</span>
+            <span class="nx">b</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]),</span>
+            <span class="nx">format</span><span class="o">:</span> <span class="nx">named</span> <span class="o">?</span> <span class="s2">&quot;name&quot;</span> <span class="o">:</span> <span class="s2">&quot;hex&quot;</span>
+        <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hex4</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span>
+            <span class="nx">r</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]),</span>
+            <span class="nx">g</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]),</span>
+            <span class="nx">b</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]),</span>
+            <span class="nx">a</span><span class="o">:</span> <span class="nx">convertHexToDecimal</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">4</span><span class="p">]),</span>
+            <span class="nx">format</span><span class="o">:</span> <span class="nx">named</span> <span class="o">?</span> <span class="s2">&quot;name&quot;</span> <span class="o">:</span> <span class="s2">&quot;hex8&quot;</span>
+        <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">((</span><span class="nx">match</span> <span class="o">=</span> <span class="nx">matchers</span><span class="p">.</span><span class="nx">hex3</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">color</span><span class="p">)))</span> <span class="p">{</span>
+        <span class="k">return</span> <span class="p">{</span>
+            <span class="nx">r</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">1</span><span class="p">]),</span>
+            <span class="nx">g</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">2</span><span class="p">]),</span>
+            <span class="nx">b</span><span class="o">:</span> <span class="nx">parseIntFromHex</span><span class="p">(</span><span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&#39;</span> <span class="o">+</span> <span class="nx">match</span><span class="p">[</span><span class="mi">3</span><span class="p">]),</span>
+            <span class="nx">format</span><span class="o">:</span> <span class="nx">named</span> <span class="o">?</span> <span class="s2">&quot;name&quot;</span> <span class="o">:</span> <span class="s2">&quot;hex&quot;</span>
+        <span class="p">};</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
+<span class="p">}</span>
+<span class="kd">function</span> <span class="nx">validateWCAG2Parms</span><span class="p">(</span><span class="nx">parms</span><span class="p">)</span> <span class="p">{</span></pre></div>             </td>           </tr>                               <tr id="section-56">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-56">&#182;</a>               </div>               <p>return valid WCAG2 parms for isReadable.
+If input parms are invalid, return {"level":"AA", "size":"small"}</p>             </td>             <td class="code">               <div class="highlight"><pre>    <span class="kd">var</span> <span class="nx">level</span><span class="p">,</span> <span class="nx">size</span><span class="p">;</span>
+    <span class="nx">parms</span> <span class="o">=</span> <span class="nx">parms</span> <span class="o">||</span> <span class="p">{</span><span class="s2">&quot;level&quot;</span><span class="o">:</span><span class="s2">&quot;AA&quot;</span><span class="p">,</span> <span class="s2">&quot;size&quot;</span><span class="o">:</span><span class="s2">&quot;small&quot;</span><span class="p">};</span>
+    <span class="nx">level</span> <span class="o">=</span> <span class="p">(</span><span class="nx">parms</span><span class="p">.</span><span class="nx">level</span> <span class="o">||</span> <span class="s2">&quot;AA&quot;</span><span class="p">).</span><span class="nx">toUpperCase</span><span class="p">();</span>
+    <span class="nx">size</span> <span class="o">=</span> <span class="p">(</span><span class="nx">parms</span><span class="p">.</span><span class="nx">size</span> <span class="o">||</span> <span class="s2">&quot;small&quot;</span><span class="p">).</span><span class="nx">toLowerCase</span><span class="p">();</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">level</span> <span class="o">!==</span> <span class="s2">&quot;AA&quot;</span> <span class="o">&amp;&amp;</span> <span class="nx">level</span> <span class="o">!==</span> <span class="s2">&quot;AAA&quot;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">level</span> <span class="o">=</span> <span class="s2">&quot;AA&quot;</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">if</span> <span class="p">(</span><span class="nx">size</span> <span class="o">!==</span> <span class="s2">&quot;small&quot;</span> <span class="o">&amp;&amp;</span> <span class="nx">size</span> <span class="o">!==</span> <span class="s2">&quot;large&quot;</span><span class="p">)</span> <span class="p">{</span>
+        <span class="nx">size</span> <span class="o">=</span> <span class="s2">&quot;small&quot;</span><span class="p">;</span>
+    <span class="p">}</span>
+    <span class="k">return</span> <span class="p">{</span><span class="s2">&quot;level&quot;</span><span class="o">:</span><span class="nx">level</span><span class="p">,</span> <span class="s2">&quot;size&quot;</span><span class="o">:</span><span class="nx">size</span><span class="p">};</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-57">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-57">&#182;</a>               </div>               <p>Node: Export function</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">module</span> <span class="o">!==</span> <span class="s2">&quot;undefined&quot;</span> <span class="o">&amp;&amp;</span> <span class="nx">module</span><span class="p">.</span><span class="nx">exports</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">module</span><span class="p">.</span><span class="nx">exports</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">;</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-58">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-58">&#182;</a>               </div>               <p>AMD/requirejs: Define the module</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">define</span> <span class="o">===</span> <span class="s1">&#39;function&#39;</span> <span class="o">&amp;&amp;</span> <span class="nx">define</span><span class="p">.</span><span class="nx">amd</span><span class="p">)</span> <span class="p">{</span>
+    <span class="nx">define</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span><span class="k">return</span> <span class="nx">tinycolor</span><span class="p">;});</span>
+<span class="p">}</span></pre></div>             </td>           </tr>                               <tr id="section-59">             <td class="docs">               <div class="pilwrap">                 <a class="pilcrow" href="#section-59">&#182;</a>               </div>               <p>Browser: Expose to window</p>             </td>             <td class="code">               <div class="highlight"><pre><span class="k">else</span> <span class="p">{</span>
+    <span class="nb">window</span><span class="p">.</span><span class="nx">tinycolor</span> <span class="o">=</span> <span class="nx">tinycolor</span><span class="p">;</span>
+<span class="p">}</span>
+<span class="p">})(</span><span class="nb">Math</span><span class="p">);</span>
+</pre></div>             </td>           </tr>                </tbody>     </table>   </div> </body> </html>