From 99a2a0ba401e1961bb31a15842afa4e1b727ed19 Mon Sep 17 00:00:00 2001
From: Ryan Oldenburg <guzba8@gmail.com>
Date: Thu, 11 Mar 2021 21:39:21 -0600
Subject: [PATCH] 1.1.0 SomeColor

---
 docs/pixie.html                 | 186 +++++++++++++++++---------------
 docs/pixie.idx                  |  29 ++---
 docs/pixie/blends.html          |   2 +-
 docs/pixie/common.html          |   2 +-
 docs/pixie/fileformats/bmp.html |   2 +-
 docs/pixie/fileformats/gif.html | 171 +++++++++++++++++++++++++++++
 docs/pixie/fileformats/gif.idx  |   2 +
 docs/pixie/fileformats/jpg.html |   2 +-
 docs/pixie/fileformats/png.html |   4 +-
 docs/pixie/fileformats/svg.html |   2 +-
 docs/pixie/images.html          |  55 +++++-----
 docs/pixie/images.idx           |  12 +--
 docs/pixie/internal.html        |   2 +-
 docs/pixie/masks.html           |   2 +-
 docs/pixie/paints.html          |   2 +-
 docs/pixie/paths.html           |  42 ++++----
 docs/pixie/paths.idx            |   8 +-
 docs/theindex.html              | 108 +++++++++++--------
 pixie.nimble                    |   4 +-
 src/pixie.nim                   |  26 ++---
 src/pixie/images.nim            |  36 ++++---
 src/pixie/paths.nim             |  25 ++---
 22 files changed, 470 insertions(+), 254 deletions(-)
 create mode 100644 docs/pixie/fileformats/gif.html
 create mode 100644 docs/pixie/fileformats/gif.idx

diff --git a/docs/pixie.html b/docs/pixie.html
index 5c69e3d..ae4f7a6 100644
--- a/docs/pixie.html
+++ b/docs/pixie.html
@@ -102,7 +102,7 @@ function main() {
   <ul class="simple simple-toc-section">
       <li><a class="reference" href="#FileFormat"
     title="FileFormat = enum
-  ffPng, ffBmp, ffJpg">FileFormat</a></li>
+  ffPng, ffBmp, ffJpg, ffGif">FileFormat</a></li>
 
   </ul>
 </li>
@@ -110,34 +110,34 @@ function main() {
   <a class="reference reference-toplevel" href="#12" id="62">Procs</a>
   <ul class="simple simple-toc-section">
       <ul class="simple nested-toc-section">fillEllipse
-      <li><a class="reference" href="#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA"
-    title="fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
-            blendMode = bmNormal)">fillEllipse,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>ColorRGBA</a></li>
+      <li><a class="reference" href="#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor"
+    title="fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
+            blendMode = bmNormal)">fillEllipse,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>SomeColor</a></li>
   <li><a class="reference" href="#fillEllipse%2CMask%2CVec2%2Cfloat32%2Cfloat32"
     title="fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)">fillEllipse,<wbr>Mask,<wbr>Vec2,<wbr>float32,<wbr>float32</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">strokeCircle
-      <li><a class="reference" href="#strokeCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA%2Cfloat"
-    title="strokeCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA;
-             strokeWidth = 1.0)">strokeCircle,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>ColorRGBA,<wbr>float</a></li>
+      <li><a class="reference" href="#strokeCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor%2Cfloat"
+    title="strokeCircle(image: Image; center: Vec2; radius: float32; color: SomeColor;
+             strokeWidth = 1.0)">strokeCircle,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokeCircle%2CMask%2CVec2%2Cfloat32%2Cfloat"
     title="strokeCircle(mask: Mask; center: Vec2; radius: float32; strokeWidth = 1.0)">strokeCircle,<wbr>Mask,<wbr>Vec2,<wbr>float32,<wbr>float</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">fillPolygon
-      <li><a class="reference" href="#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA"
-    title="fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: ColorRGBA)">fillPolygon,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>int,<wbr>ColorRGBA</a></li>
+      <li><a class="reference" href="#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor"
+    title="fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: SomeColor)">fillPolygon,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>int,<wbr>SomeColor</a></li>
   <li><a class="reference" href="#fillPolygon%2CMask%2CVec2%2Cfloat32%2Cint"
     title="fillPolygon(mask: Mask; pos: Vec2; size: float32; sides: int)">fillPolygon,<wbr>Mask,<wbr>Vec2,<wbr>float32,<wbr>int</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">fillRoundedRect
-      <li><a class="reference" href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA"
+      <li><a class="reference" href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor"
     title="fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                color: ColorRGBA)">fillRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>ColorRGBA</a></li>
-  <li><a class="reference" href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA"
-    title="fillRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA)">fillRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>ColorRGBA</a></li>
+                color: SomeColor)">fillRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>SomeColor</a></li>
+  <li><a class="reference" href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor"
+    title="fillRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor)">fillRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>SomeColor</a></li>
   <li><a class="reference" href="#fillRoundedRect%2CMask%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32"
     title="fillRoundedRect(mask: Mask; rect: Rect; nw, ne, se, sw: float32)">fillRoundedRect,<wbr>Mask,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32</a></li>
   <li><a class="reference" href="#fillRoundedRect%2CMask%2CRect%2Cfloat32"
@@ -150,12 +150,12 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">strokeRoundedRect
-      <li><a class="reference" href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat"
+      <li><a class="reference" href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat"
     title="strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                  color: ColorRGBA; strokeWidth = 1.0)">strokeRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>ColorRGBA,<wbr>float</a></li>
-  <li><a class="reference" href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA%2Cfloat"
-    title="strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA;
-                  strokeWidth = 1.0)">strokeRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>ColorRGBA,<wbr>float</a></li>
+                  color: SomeColor; strokeWidth = 1.0)">strokeRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>SomeColor,<wbr>float</a></li>
+  <li><a class="reference" href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor%2Cfloat"
+    title="strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor;
+                  strokeWidth = 1.0)">strokeRoundedRect,<wbr>Image,<wbr>Rect,<wbr>float32,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokeRoundedRect%2CMask%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat"
     title="strokeRoundedRect(mask: Mask; rect: Rect; nw, ne, se, sw: float32;
                   strokeWidth = 1.0)">strokeRoundedRect,<wbr>Mask,<wbr>Rect,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float32,<wbr>float</a></li>
@@ -176,40 +176,40 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">fillCircle
-      <li><a class="reference" href="#fillCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA"
-    title="fillCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA)">fillCircle,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>ColorRGBA</a></li>
+      <li><a class="reference" href="#fillCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor"
+    title="fillCircle(image: Image; center: Vec2; radius: float32; color: SomeColor)">fillCircle,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>SomeColor</a></li>
   <li><a class="reference" href="#fillCircle%2CMask%2CVec2%2Cfloat32"
     title="fillCircle(mask: Mask; center: Vec2; radius: float32)">fillCircle,<wbr>Mask,<wbr>Vec2,<wbr>float32</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">strokePolygon
-      <li><a class="reference" href="#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA%2Cfloat"
+      <li><a class="reference" href="#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor%2Cfloat"
     title="strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;
-              color: ColorRGBA; strokeWidth = 1.0)">strokePolygon,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>int,<wbr>ColorRGBA,<wbr>float</a></li>
+              color: SomeColor; strokeWidth = 1.0)">strokePolygon,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>int,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokePolygon%2CMask%2CVec2%2Cfloat32%2Cint%2Cfloat"
     title="strokePolygon(mask: Mask; pos: Vec2; size: float32; sides: int;
               strokeWidth = 1.0)">strokePolygon,<wbr>Mask,<wbr>Vec2,<wbr>float32,<wbr>int,<wbr>float</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">fillRect
-      <li><a class="reference" href="#fillRect%2CImage%2CRect%2CColorRGBA"
-    title="fillRect(image: Image; rect: Rect; color: ColorRGBA)">fillRect,<wbr>Image,<wbr>Rect,<wbr>ColorRGBA</a></li>
+      <li><a class="reference" href="#fillRect%2CImage%2CRect%2CSomeColor"
+    title="fillRect(image: Image; rect: Rect; color: SomeColor)">fillRect,<wbr>Image,<wbr>Rect,<wbr>SomeColor</a></li>
   <li><a class="reference" href="#fillRect%2CMask%2CRect"
     title="fillRect(mask: Mask; rect: Rect)">fillRect,<wbr>Mask,<wbr>Rect</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">strokeSegment
-      <li><a class="reference" href="#strokeSegment%2CImage%2CSegment%2CColorRGBA%2Cfloat"
-    title="strokeSegment(image: Image; segment: Segment; color: ColorRGBA;
-              strokeWidth = 1.0)">strokeSegment,<wbr>Image,<wbr>Segment,<wbr>ColorRGBA,<wbr>float</a></li>
+      <li><a class="reference" href="#strokeSegment%2CImage%2CSegment%2CSomeColor%2Cfloat"
+    title="strokeSegment(image: Image; segment: Segment; color: SomeColor;
+              strokeWidth = 1.0)">strokeSegment,<wbr>Image,<wbr>Segment,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokeSegment%2CMask%2CSegment%2Cfloat32"
     title="strokeSegment(mask: Mask; segment: Segment; strokeWidth: float32)">strokeSegment,<wbr>Mask,<wbr>Segment,<wbr>float32</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">strokeEllipse
-      <li><a class="reference" href="#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat"
-    title="strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
-              strokeWidth = 1.0)">strokeEllipse,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>ColorRGBA,<wbr>float</a></li>
+      <li><a class="reference" href="#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat"
+    title="strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
+              strokeWidth = 1.0)">strokeEllipse,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokeEllipse%2CMask%2CVec2%2Cfloat32%2Cfloat32%2Cfloat"
     title="strokeEllipse(mask: Mask; center: Vec2; rx, ry: float32; strokeWidth = 1.0)">strokeEllipse,<wbr>Mask,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>float</a></li>
 
@@ -220,8 +220,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">strokeRect
-      <li><a class="reference" href="#strokeRect%2CImage%2CRect%2CColorRGBA%2Cfloat"
-    title="strokeRect(image: Image; rect: Rect; color: ColorRGBA; strokeWidth = 1.0)">strokeRect,<wbr>Image,<wbr>Rect,<wbr>ColorRGBA,<wbr>float</a></li>
+      <li><a class="reference" href="#strokeRect%2CImage%2CRect%2CSomeColor%2Cfloat"
+    title="strokeRect(image: Image; rect: Rect; color: SomeColor; strokeWidth = 1.0)">strokeRect,<wbr>Image,<wbr>Rect,<wbr>SomeColor,<wbr>float</a></li>
   <li><a class="reference" href="#strokeRect%2CMask%2CRect%2Cfloat"
     title="strokeRect(mask: Mask; rect: Rect; strokeWidth = 1.0)">strokeRect,<wbr>Mask,<wbr>Rect,<wbr>float</a></li>
 
@@ -229,6 +229,16 @@ function main() {
 
   </ul>
 </li>
+<li>
+  <a class="reference reference-toplevel" href="#16" id="66">Converters</a>
+  <ul class="simple simple-toc-section">
+      <li><a class="reference" href="#autoStraightAlpha.c%2CColorRGBX"
+    title="autoStraightAlpha(c: ColorRGBX): ColorRGBA">autoStraightAlpha</a></li>
+  <li><a class="reference" href="#autoPremultipliedAlpha.c%2CColorRGBA"
+    title="autoPremultipliedAlpha(c: ColorRGBA): ColorRGBX">autoPremultipliedAlpha</a></li>
+
+  </ul>
+</li>
 <li>
   <a class="reference reference-toplevel" href="#19" id="69">Exports</a>
   <ul class="simple simple-toc-section">
@@ -246,14 +256,14 @@ function main() {
   <div class="section" id="6">
 <h1><a class="toc-backref" href="#6">Imports</a></h1>
 <dl class="item">
-<a class="reference external" href="pixie/blends.html">pixie/blends</a>, <a class="reference external" href="pixie/common.html">pixie/common</a>, <a class="reference external" href="pixie/fileformats/bmp.html">pixie/fileformats/bmp</a>, <a class="reference external" href="pixie/fileformats/jpg.html">pixie/fileformats/jpg</a>, <a class="reference external" href="pixie/fileformats/png.html">pixie/fileformats/png</a>, <a class="reference external" href="pixie/fileformats/svg.html">pixie/fileformats/svg</a>, <a class="reference external" href="pixie/images.html">pixie/images</a>, <a class="reference external" href="pixie/masks.html">pixie/masks</a>, <a class="reference external" href="pixie/paints.html">pixie/paints</a>, <a class="reference external" href="pixie/paths.html">pixie/paths</a>
+<a class="reference external" href="pixie/blends.html">pixie/blends</a>, <a class="reference external" href="pixie/common.html">pixie/common</a>, <a class="reference external" href="pixie/fileformats/bmp.html">pixie/fileformats/bmp</a>, <a class="reference external" href="pixie/fileformats/gif.html">pixie/fileformats/gif</a>, <a class="reference external" href="pixie/fileformats/jpg.html">pixie/fileformats/jpg</a>, <a class="reference external" href="pixie/fileformats/png.html">pixie/fileformats/png</a>, <a class="reference external" href="pixie/fileformats/svg.html">pixie/fileformats/svg</a>, <a class="reference external" href="pixie/images.html">pixie/images</a>, <a class="reference external" href="pixie/masks.html">pixie/masks</a>, <a class="reference external" href="pixie/paints.html">pixie/paints</a>, <a class="reference external" href="pixie/paths.html">pixie/paths</a>
 </dl></div>
 <div class="section" id="7">
 <h1><a class="toc-backref" href="#7">Types</a></h1>
 <dl class="item">
 <a id="FileFormat"></a>
 <dt><pre><a href="pixie.html#FileFormat"><span class="Identifier">FileFormat</span></a> <span class="Other">=</span> <span class="Keyword">enum</span>
-  <span class="Identifier">ffPng</span><span class="Other">,</span> <span class="Identifier">ffBmp</span><span class="Other">,</span> <span class="Identifier">ffJpg</span></pre></dt>
+  <span class="Identifier">ffPng</span><span class="Other">,</span> <span class="Identifier">ffBmp</span><span class="Other">,</span> <span class="Identifier">ffJpg</span><span class="Other">,</span> <span class="Identifier">ffGif</span></pre></dt>
 <dd>
 
 
@@ -303,9 +313,8 @@ Writes an image to a file.
 Writes an image to a file.
 
 </dd>
-<a id="fillRect,Image,Rect,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillRect%2CImage%2CRect%2CColorRGBA"><span class="Identifier">fillRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillRect,Image,Rect,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillRect%2CImage%2CRect%2CSomeColor"><span class="Identifier">fillRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills a rectangle.
@@ -319,9 +328,8 @@ Fills a rectangle.
 Fills a rectangle.
 
 </dd>
-<a id="strokeRect,Image,Rect,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeRect%2CImage%2CRect%2CColorRGBA%2Cfloat"><span class="Identifier">strokeRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeRect,Image,Rect,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeRect%2CImage%2CRect%2CSomeColor%2Cfloat"><span class="Identifier">strokeRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a rectangle.
@@ -335,18 +343,16 @@ Strokes a rectangle.
 Strokes a rectangle.
 
 </dd>
-<a id="fillRoundedRect,Image,Rect,float32,float32,float32,float32,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA"><span class="Identifier">fillRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">nw</span><span class="Other">,</span> <span class="Identifier">ne</span><span class="Other">,</span> <span class="Identifier">se</span><span class="Other">,</span> <span class="Identifier">sw</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
-                     <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span>
-    <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillRoundedRect,Image,Rect,float32,float32,float32,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor"><span class="Identifier">fillRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">nw</span><span class="Other">,</span> <span class="Identifier">ne</span><span class="Other">,</span> <span class="Identifier">se</span><span class="Other">,</span> <span class="Identifier">sw</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
+                     <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills a rounded rectangle.
 
 </dd>
-<a id="fillRoundedRect,Image,Rect,float32,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA"><span class="Identifier">fillRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillRoundedRect,Image,Rect,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor"><span class="Identifier">fillRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills a rounded rectangle.
@@ -368,19 +374,17 @@ Fills a rounded rectangle.
 Fills a rounded rectangle.
 
 </dd>
-<a id="strokeRoundedRect,Image,Rect,float32,float32,float32,float32,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat"><span class="Identifier">strokeRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">nw</span><span class="Other">,</span> <span class="Identifier">ne</span><span class="Other">,</span> <span class="Identifier">se</span><span class="Other">,</span> <span class="Identifier">sw</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
-                       <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeRoundedRect,Image,Rect,float32,float32,float32,float32,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat"><span class="Identifier">strokeRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">nw</span><span class="Other">,</span> <span class="Identifier">ne</span><span class="Other">,</span> <span class="Identifier">se</span><span class="Other">,</span> <span class="Identifier">sw</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
+                       <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a rounded rectangle.
 
 </dd>
-<a id="strokeRoundedRect,Image,Rect,float32,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA%2Cfloat"><span class="Identifier">strokeRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
-                       <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeRoundedRect,Image,Rect,float32,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor%2Cfloat"><span class="Identifier">strokeRoundedRect</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rect</span><span class="Other">:</span> <span class="Identifier">Rect</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
+                       <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a rounded rectangle.
@@ -404,10 +408,9 @@ Strokes a rounded rectangle.
 Strokes a rounded rectangle.
 
 </dd>
-<a id="strokeSegment,Image,Segment,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeSegment%2CImage%2CSegment%2CColorRGBA%2Cfloat"><span class="Identifier">strokeSegment</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">segment</span><span class="Other">:</span> <span class="Identifier">Segment</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span>
-                   <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span>
-                                        <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeSegment,Image,Segment,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeSegment%2CImage%2CSegment%2CSomeColor%2Cfloat"><span class="Identifier">strokeSegment</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">segment</span><span class="Other">:</span> <span class="Identifier">Segment</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
+                   <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a segment (draws a line from segment.at to segment.to).
@@ -421,10 +424,9 @@ Strokes a segment (draws a line from segment.at to segment.to).
 Strokes a segment (draws a line from segment.at to segment.to).
 
 </dd>
-<a id="fillEllipse,Image,Vec2,float32,float32,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA"><span class="Identifier">fillEllipse</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">rx</span><span class="Other">,</span> <span class="Identifier">ry</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span>
-                 <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span>
-    <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillEllipse,Image,Vec2,float32,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor"><span class="Identifier">fillEllipse</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">rx</span><span class="Other">,</span> <span class="Identifier">ry</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
+                 <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills an ellipse.
@@ -438,10 +440,9 @@ Fills an ellipse.
 Fills an ellipse.
 
 </dd>
-<a id="strokeEllipse,Image,Vec2,float32,float32,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat"><span class="Identifier">strokeEllipse</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">rx</span><span class="Other">,</span> <span class="Identifier">ry</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
-                   <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeEllipse,Image,Vec2,float32,float32,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat"><span class="Identifier">strokeEllipse</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">rx</span><span class="Other">,</span> <span class="Identifier">ry</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span>
+                   <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes an ellipse.
@@ -455,9 +456,8 @@ Strokes an ellipse.
 Strokes an ellipse.
 
 </dd>
-<a id="fillCircle,Image,Vec2,float32,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA"><span class="Identifier">fillCircle</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillCircle,Image,Vec2,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor"><span class="Identifier">fillCircle</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills a circle.
@@ -471,10 +471,9 @@ Fills a circle.
 Fills a circle.
 
 </dd>
-<a id="strokeCircle,Image,Vec2,float32,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokeCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA%2Cfloat"><span class="Identifier">strokeCircle</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span>
-                  <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span>
-                                       <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokeCircle,Image,Vec2,float32,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokeCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor%2Cfloat"><span class="Identifier">strokeCircle</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">center</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
+                  <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a circle.
@@ -488,10 +487,9 @@ Strokes a circle.
 Strokes a circle.
 
 </dd>
-<a id="fillPolygon,Image,Vec2,float32,int,ColorRGBA"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA"><span class="Identifier">fillPolygon</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">pos</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">size</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">sides</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span>
-                 <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span>
-                                     <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillPolygon,Image,Vec2,float32,int,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor"><span class="Identifier">fillPolygon</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">pos</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">size</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">sides</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span>
+                 <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills a polygon.
@@ -505,10 +503,9 @@ Fills a polygon.
 Fills a polygon.
 
 </dd>
-<a id="strokePolygon,Image,Vec2,float32,int,ColorRGBA,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA%2Cfloat"><span class="Identifier">strokePolygon</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">pos</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">size</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">sides</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span>
-                   <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="strokePolygon,Image,Vec2,float32,int,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor%2Cfloat"><span class="Identifier">strokePolygon</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">pos</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">size</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">sides</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span>
+                   <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Strokes a polygon.
@@ -524,11 +521,32 @@ Strokes a polygon.
 
 </dd>
 
+</dl></div>
+<div class="section" id="16">
+<h1><a class="toc-backref" href="#16">Converters</a></h1>
+<dl class="item">
+<a id="autoStraightAlpha.c,ColorRGBX"></a>
+<dt><pre><span class="Keyword">converter</span> <a href="#autoStraightAlpha.c%2CColorRGBX"><span class="Identifier">autoStraightAlpha</span></a><span class="Other">(</span><span class="Identifier">c</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
+    <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<dd>
+
+Convert a paremultiplied alpha RGBA to a straight alpha RGBA.
+
+</dd>
+<a id="autoPremultipliedAlpha.c,ColorRGBA"></a>
+<dt><pre><span class="Keyword">converter</span> <a href="#autoPremultipliedAlpha.c%2CColorRGBA"><span class="Identifier">autoPremultipliedAlpha</span></a><span class="Other">(</span><span class="Identifier">c</span><span class="Other">:</span> <span class="Identifier">ColorRGBA</span><span class="Other">)</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
+    <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<dd>
+
+Convert a straight alpha RGBA to a premultiplied alpha RGBA.
+
+</dd>
+
 </dl></div>
 <div class="section" id="19">
 <h1><a class="toc-backref" href="#19">Exports</a></h1>
 <dl class="item">
-<a href="pixie/blends.html#maskerSimd,BlendMode"><span class="Identifier">maskerSimd</span></a>, <a href="pixie/blends.html#Masker"><span class="Identifier">Masker</span></a>, <a href="pixie/blends.html#blender,BlendMode"><span class="Identifier">blender</span></a>, <a href="pixie/blends.html#hasSimdBlender,BlendMode"><span class="Identifier">hasSimdBlender</span></a>, <a href="pixie/blends.html#Blender"><span class="Identifier">Blender</span></a>, <a href="pixie/blends.html#BlenderSimd"><span class="Identifier">BlenderSimd</span></a>, <a href="pixie/blends.html#MaskerSimd"><span class="Identifier">MaskerSimd</span></a>, <a href="pixie/blends.html#blenderSimd,BlendMode"><span class="Identifier">blenderSimd</span></a>, <a href="pixie/blends.html#hasSimdMasker,BlendMode"><span class="Identifier">hasSimdMasker</span></a>, <a href="pixie/blends.html#masker,BlendMode"><span class="Identifier">masker</span></a>, <a href="pixie/blends.html#BlendMode"><span class="Identifier">BlendMode</span></a>, <a href="pixie/blends.html#blendAlpha,uint8,uint8"><span class="Identifier">blendAlpha</span></a>, <a href="pixie/common.html#PixieError"><span class="Identifier">PixieError</span></a>, <a href="pixie/common.html#lerp,Color,Color,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/common.html#lerp,uint8,uint8,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/common.html#fractional,float32"><span class="Identifier">fractional</span></a>, <a href="pixie/common.html#lerp,ColorRGBX,ColorRGBX,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/images.html#getRgbaUnsafe,Image,int,int"><span class="Identifier">getRgbaUnsafe</span></a>, <a href="pixie/images.html#draw,Image,Mask,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#[]=,Image,int,int,ColorRGBX"><span class="Identifier">[]=</span></a>, <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a>, <a href="pixie/images.html#copy,Image"><span class="Identifier">copy</span></a>, <a href="pixie/images.html#wh,Image"><span class="Identifier">wh</span></a>, <a href="pixie/images.html#setRgbaUnsafe,Image,int,int,ColorRGBX"><span class="Identifier">setRgbaUnsafe</span></a>, <a href="pixie/images.html#inside,Image,int,int"><span class="Identifier">inside</span></a>, <a href="pixie/images.html#getRgbaSmooth,Image,float32,float32"><span class="Identifier">getRgbaSmooth</span></a>, <a href="pixie/images.html#invert"><span class="Identifier">invert</span></a>, <a href="pixie/images.html#flipVertical,Image"><span class="Identifier">flipVertical</span></a>, <a href="pixie/images.html#magnifyBy2,Image,int"><span class="Identifier">magnifyBy2</span></a>, <a href="pixie/images.html#draw,Mask,Mask"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#draw,Image,Mask"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#flipHorizontal,Image"><span class="Identifier">flipHorizontal</span></a>, <a href="pixie/images.html#shadow,Image,Vec2,float32,float32,ColorRGBX"><span class="Identifier">shadow</span></a>, <a href="pixie/images.html#subImage,Image,int,int,int,int"><span class="Identifier">subImage</span></a>, <a href="pixie/images.html#diff,Image,Image"><span class="Identifier">diff</span></a>, <a href="pixie/images.html#$,Image"><span class="Identifier">$</span></a>, <a href="pixie/images.html#draw,Mask,Image,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#shift,,Vec2"><span class="Identifier">shift</span></a>, <a href="pixie/images.html#dataIndex,Image,int,int"><span class="Identifier">dataIndex</span></a>, <a href="pixie/images.html#minifyBy2,Image,int"><span class="Identifier">minifyBy2</span></a>, <a href="pixie/images.html#draw,Image,Image"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#draw,Image,Image,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#fill,Image,ColorRGBX"><span class="Identifier">fill</span></a>, <a href="pixie/images.html#draw,Mask,Mask,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#newMask,Image"><span class="Identifier">newMask</span></a>, <a href="pixie/images.html#blur,Image,float32"><span class="Identifier">blur</span></a>, <a href="pixie/images.html#newImage,int,int"><span class="Identifier">newImage</span></a>, <a href="pixie/images.html#drawTiled,Image,Image,Mat3"><span class="Identifier">drawTiled</span></a>, <a href="pixie/images.html#applyOpacity,,float32"><span class="Identifier">applyOpacity</span></a>, <a href="pixie/images.html#resize,Image,int,int"><span class="Identifier">resize</span></a>, <a href="pixie/images.html#superImage,Image,int,int,int,int"><span class="Identifier">superImage</span></a>, <a href="pixie/images.html#fillUnsafe,seq[ColorRGBX],ColorRGBX,int,int"><span class="Identifier">fillUnsafe</span></a>, <a href="pixie/images.html#draw,Mask,Image"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#[],Image,int,int"><span class="Identifier">[]</span></a>, <a href="pixie/masks.html#$,Mask"><span class="Identifier">$</span></a>, <a href="pixie/masks.html#setValueUnsafe,Mask,int,int,uint8"><span class="Identifier">setValueUnsafe</span></a>, <a href="pixie/masks.html#ceil,Mask"><span class="Identifier">ceil</span></a>, <a href="pixie/masks.html#dataIndex,Mask,int,int"><span class="Identifier">dataIndex</span></a>, <a href="pixie/masks.html#[]=,Mask,int,int,uint8"><span class="Identifier">[]=</span></a>, <a href="pixie/masks.html#spread,Mask,float32"><span class="Identifier">spread</span></a>, <a href="pixie/masks.html#copy,Mask"><span class="Identifier">copy</span></a>, <a href="pixie/masks.html#wh,Mask"><span class="Identifier">wh</span></a>, <a href="pixie/masks.html#newMask,int,int"><span class="Identifier">newMask</span></a>, <a href="pixie/masks.html#minifyBy2,Mask,int"><span class="Identifier">minifyBy2</span></a>, <a href="pixie/masks.html#fill,Mask,uint8"><span class="Identifier">fill</span></a>, <a href="pixie/masks.html#Mask"><span class="Identifier">Mask</span></a>, <a href="pixie/masks.html#getValueUnsafe,Mask,int,int"><span class="Identifier">getValueUnsafe</span></a>, <a href="pixie/masks.html#getValueSmooth,Mask,float32,float32"><span class="Identifier">getValueSmooth</span></a>, <a href="pixie/masks.html#blur,Mask,float32,uint8"><span class="Identifier">blur</span></a>, <a href="pixie/masks.html#fillUnsafe,seq[uint8],uint8,int,int"><span class="Identifier">fillUnsafe</span></a>, <a href="pixie/masks.html#inside,Mask,int,int"><span class="Identifier">inside</span></a>, <a href="pixie/masks.html#[],Mask,int,int"><span class="Identifier">[]</span></a>, <a href="pixie/paints.html#ColorStop"><span class="Identifier">ColorStop</span></a>, <a href="pixie/paints.html#PaintKind"><span class="Identifier">PaintKind</span></a>, <a href="pixie/paints.html#fillLinearGradient,Image,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillLinearGradient</span></a>, <a href="pixie/paints.html#fillRadialGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillRadialGradient</span></a>, <a href="pixie/paints.html#fillAngularGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillAngularGradient</span></a>, <a href="pixie/paints.html#Paint"><span class="Identifier">Paint</span></a>, <a href="pixie/paths.html#bezierCurveTo,Path,float32,float32,float32,float32,float32,float32"><span class="Identifier">bezierCurveTo</span></a>, <a href="pixie/paths.html#LineCap"><span class="Identifier">LineCap</span></a>, <a href="pixie/paths.html#arcTo,Path,Vec2,Vec2,float32"><span class="Identifier">arcTo</span></a>, <a href="pixie/paths.html#LineJoin"><span class="Identifier">LineJoin</span></a>, <a href="pixie/paths.html#rect,Path,Vec2,Vec2"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#bezierCurveTo,Path,Vec2,Vec2,Vec2"><span class="Identifier">bezierCurveTo</span></a>, <a href="pixie/paths.html#SomePath"><span class="Identifier">SomePath</span></a>, <a href="pixie/paths.html#strokePath,Mask,SomePath,,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#$,Path"><span class="Identifier">$</span></a>, <a href="pixie/paths.html#parsePath,string"><span class="Identifier">parsePath</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,Paint"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#lineTo,Path,float32,float32"><span class="Identifier">lineTo</span></a>, <a href="pixie/paths.html#polygon,Path,Vec2,float32,int"><span class="Identifier">polygon</span></a>, <a href="pixie/paths.html#roundedRect,Path,float32,float32,float32,float32,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#quadraticCurveTo,Path,Vec2,Vec2"><span class="Identifier">quadraticCurveTo</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,ColorRGBX"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#strokePath,Image,SomePath,ColorRGBX,,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#ellipticalArcTo,Path,float32,float32,float32,bool,bool,float32,float32"><span class="Identifier">ellipticalArcTo</span></a>, <a href="pixie/paths.html#Path"><span class="Identifier">Path</span></a>, <a href="pixie/paths.html#lineTo,Path,Vec2"><span class="Identifier">lineTo</span></a>, <a href="pixie/paths.html#ellipse,Path,Vec2,float32,float32"><span class="Identifier">ellipse</span></a>, <a href="pixie/paths.html#quadraticCurveTo,Path,float32,float32,float32,float32"><span class="Identifier">quadraticCurveTo</span></a>, <a href="pixie/paths.html#arcTo,Path,float32,float32,float32,float32,float32"><span class="Identifier">arcTo</span></a>, <a href="pixie/paths.html#moveTo,Path,float32,float32"><span class="Identifier">moveTo</span></a>, <a href="pixie/paths.html#roundedRect,Path,Rect,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#PathCommandKind"><span class="Identifier">PathCommandKind</span></a>, <a href="pixie/paths.html#polygon,Path,float32,float32,float32,int"><span class="Identifier">polygon</span></a>, <a href="pixie/paths.html#strokePath,Image,SomePath,ColorRGBX,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#transform,Path,Mat3"><span class="Identifier">transform</span></a>, <a href="pixie/paths.html#PathCommand"><span class="Identifier">PathCommand</span></a>, <a href="pixie/paths.html#roundedRect,Path,Vec2,Vec2,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#rect,Path,Rect"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,ColorRGBX,"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#segments.i,seq[Vec2]"><span class="Identifier">segments</span></a>, <a href="pixie/paths.html#closePath,Path"><span class="Identifier">closePath</span></a>, <a href="pixie/paths.html#addPath,Path,Path"><span class="Identifier">addPath</span></a>, <a href="pixie/paths.html#rect,Path,float32,float32,float32,float32"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#strokePath,Mask,SomePath,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#commandsToShapes,Path,float32"><span class="Identifier">commandsToShapes</span></a>, <a href="pixie/paths.html#ellipse,Path,float32,float32,float32,float32"><span class="Identifier">ellipse</span></a>, <a href="pixie/paths.html#WindingRule"><span class="Identifier">WindingRule</span></a>, <a href="pixie/paths.html#fillPath,Mask,SomePath,"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#moveTo,Path,Vec2"><span class="Identifier">moveTo</span></a>, <a href="pixie/paths.html#fillPath,Mask,SomePath"><span class="Identifier">fillPath</span></a>
+<a href="pixie/blends.html#maskerSimd,BlendMode"><span class="Identifier">maskerSimd</span></a>, <a href="pixie/blends.html#Masker"><span class="Identifier">Masker</span></a>, <a href="pixie/blends.html#blender,BlendMode"><span class="Identifier">blender</span></a>, <a href="pixie/blends.html#hasSimdBlender,BlendMode"><span class="Identifier">hasSimdBlender</span></a>, <a href="pixie/blends.html#Blender"><span class="Identifier">Blender</span></a>, <a href="pixie/blends.html#BlenderSimd"><span class="Identifier">BlenderSimd</span></a>, <a href="pixie/blends.html#MaskerSimd"><span class="Identifier">MaskerSimd</span></a>, <a href="pixie/blends.html#blenderSimd,BlendMode"><span class="Identifier">blenderSimd</span></a>, <a href="pixie/blends.html#hasSimdMasker,BlendMode"><span class="Identifier">hasSimdMasker</span></a>, <a href="pixie/blends.html#masker,BlendMode"><span class="Identifier">masker</span></a>, <a href="pixie/blends.html#BlendMode"><span class="Identifier">BlendMode</span></a>, <a href="pixie/blends.html#blendAlpha,uint8,uint8"><span class="Identifier">blendAlpha</span></a>, <a href="pixie/common.html#PixieError"><span class="Identifier">PixieError</span></a>, <a href="pixie/common.html#lerp,Color,Color,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/common.html#lerp,uint8,uint8,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/common.html#fractional,float32"><span class="Identifier">fractional</span></a>, <a href="pixie/common.html#lerp,ColorRGBX,ColorRGBX,float32"><span class="Identifier">lerp</span></a>, <a href="pixie/images.html#getRgbaUnsafe,Image,int,int"><span class="Identifier">getRgbaUnsafe</span></a>, <a href="pixie/images.html#draw,Image,Mask,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#[]=,Image,int,int,SomeColor"><span class="Identifier">[]=</span></a>, <a href="pixie/images.html#Image"><span class="Identifier">Image</span></a>, <a href="pixie/images.html#copy,Image"><span class="Identifier">copy</span></a>, <a href="pixie/images.html#wh,Image"><span class="Identifier">wh</span></a>, <a href="pixie/images.html#setRgbaUnsafe,Image,int,int,SomeColor"><span class="Identifier">setRgbaUnsafe</span></a>, <a href="pixie/images.html#inside,Image,int,int"><span class="Identifier">inside</span></a>, <a href="pixie/images.html#getRgbaSmooth,Image,float32,float32"><span class="Identifier">getRgbaSmooth</span></a>, <a href="pixie/images.html#invert"><span class="Identifier">invert</span></a>, <a href="pixie/images.html#flipVertical,Image"><span class="Identifier">flipVertical</span></a>, <a href="pixie/images.html#magnifyBy2,Image,int"><span class="Identifier">magnifyBy2</span></a>, <a href="pixie/images.html#draw,Mask,Mask"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#draw,Image,Mask"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#flipHorizontal,Image"><span class="Identifier">flipHorizontal</span></a>, <a href="pixie/images.html#shadow,Image,Vec2,float32,float32,SomeColor"><span class="Identifier">shadow</span></a>, <a href="pixie/images.html#subImage,Image,int,int,int,int"><span class="Identifier">subImage</span></a>, <a href="pixie/images.html#diff,Image,Image"><span class="Identifier">diff</span></a>, <a href="pixie/images.html#$,Image"><span class="Identifier">$</span></a>, <a href="pixie/images.html#draw,Mask,Image,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#shift,,Vec2"><span class="Identifier">shift</span></a>, <a href="pixie/images.html#dataIndex,Image,int,int"><span class="Identifier">dataIndex</span></a>, <a href="pixie/images.html#minifyBy2,Image,int"><span class="Identifier">minifyBy2</span></a>, <a href="pixie/images.html#draw,Image,Image"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#draw,Image,Image,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#fill,Image,SomeColor"><span class="Identifier">fill</span></a>, <a href="pixie/images.html#draw,Mask,Mask,Mat3"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#newMask,Image"><span class="Identifier">newMask</span></a>, <a href="pixie/images.html#blur,Image,float32,SomeColor"><span class="Identifier">blur</span></a>, <a href="pixie/images.html#newImage,int,int"><span class="Identifier">newImage</span></a>, <a href="pixie/images.html#drawTiled,Image,Image,Mat3"><span class="Identifier">drawTiled</span></a>, <a href="pixie/images.html#applyOpacity,,float32"><span class="Identifier">applyOpacity</span></a>, <a href="pixie/images.html#resize,Image,int,int"><span class="Identifier">resize</span></a>, <a href="pixie/images.html#superImage,Image,int,int,int,int"><span class="Identifier">superImage</span></a>, <a href="pixie/images.html#fillUnsafe,seq[ColorRGBX],SomeColor,int,int"><span class="Identifier">fillUnsafe</span></a>, <a href="pixie/images.html#draw,Mask,Image"><span class="Identifier">draw</span></a>, <a href="pixie/images.html#[],Image,int,int"><span class="Identifier">[]</span></a>, <a href="pixie/masks.html#$,Mask"><span class="Identifier">$</span></a>, <a href="pixie/masks.html#setValueUnsafe,Mask,int,int,uint8"><span class="Identifier">setValueUnsafe</span></a>, <a href="pixie/masks.html#ceil,Mask"><span class="Identifier">ceil</span></a>, <a href="pixie/masks.html#dataIndex,Mask,int,int"><span class="Identifier">dataIndex</span></a>, <a href="pixie/masks.html#[]=,Mask,int,int,uint8"><span class="Identifier">[]=</span></a>, <a href="pixie/masks.html#spread,Mask,float32"><span class="Identifier">spread</span></a>, <a href="pixie/masks.html#copy,Mask"><span class="Identifier">copy</span></a>, <a href="pixie/masks.html#wh,Mask"><span class="Identifier">wh</span></a>, <a href="pixie/masks.html#newMask,int,int"><span class="Identifier">newMask</span></a>, <a href="pixie/masks.html#minifyBy2,Mask,int"><span class="Identifier">minifyBy2</span></a>, <a href="pixie/masks.html#fill,Mask,uint8"><span class="Identifier">fill</span></a>, <a href="pixie/masks.html#Mask"><span class="Identifier">Mask</span></a>, <a href="pixie/masks.html#getValueUnsafe,Mask,int,int"><span class="Identifier">getValueUnsafe</span></a>, <a href="pixie/masks.html#getValueSmooth,Mask,float32,float32"><span class="Identifier">getValueSmooth</span></a>, <a href="pixie/masks.html#blur,Mask,float32,uint8"><span class="Identifier">blur</span></a>, <a href="pixie/masks.html#fillUnsafe,seq[uint8],uint8,int,int"><span class="Identifier">fillUnsafe</span></a>, <a href="pixie/masks.html#inside,Mask,int,int"><span class="Identifier">inside</span></a>, <a href="pixie/masks.html#[],Mask,int,int"><span class="Identifier">[]</span></a>, <a href="pixie/paints.html#ColorStop"><span class="Identifier">ColorStop</span></a>, <a href="pixie/paints.html#PaintKind"><span class="Identifier">PaintKind</span></a>, <a href="pixie/paints.html#fillLinearGradient,Image,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillLinearGradient</span></a>, <a href="pixie/paints.html#fillRadialGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillRadialGradient</span></a>, <a href="pixie/paints.html#fillAngularGradient,Image,Vec2,Vec2,Vec2,seq[ColorStop]"><span class="Identifier">fillAngularGradient</span></a>, <a href="pixie/paints.html#Paint"><span class="Identifier">Paint</span></a>, <a href="pixie/paths.html#bezierCurveTo,Path,float32,float32,float32,float32,float32,float32"><span class="Identifier">bezierCurveTo</span></a>, <a href="pixie/paths.html#LineCap"><span class="Identifier">LineCap</span></a>, <a href="pixie/paths.html#arcTo,Path,Vec2,Vec2,float32"><span class="Identifier">arcTo</span></a>, <a href="pixie/paths.html#LineJoin"><span class="Identifier">LineJoin</span></a>, <a href="pixie/paths.html#rect,Path,Vec2,Vec2"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#bezierCurveTo,Path,Vec2,Vec2,Vec2"><span class="Identifier">bezierCurveTo</span></a>, <a href="pixie/paths.html#SomePath"><span class="Identifier">SomePath</span></a>, <a href="pixie/paths.html#strokePath,Mask,SomePath,,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#$,Path"><span class="Identifier">$</span></a>, <a href="pixie/paths.html#parsePath,string"><span class="Identifier">parsePath</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,Paint"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#lineTo,Path,float32,float32"><span class="Identifier">lineTo</span></a>, <a href="pixie/paths.html#polygon,Path,Vec2,float32,int"><span class="Identifier">polygon</span></a>, <a href="pixie/paths.html#roundedRect,Path,float32,float32,float32,float32,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#quadraticCurveTo,Path,Vec2,Vec2"><span class="Identifier">quadraticCurveTo</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,SomeColor"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#strokePath,Image,SomePath,SomeColor,,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#ellipticalArcTo,Path,float32,float32,float32,bool,bool,float32,float32"><span class="Identifier">ellipticalArcTo</span></a>, <a href="pixie/paths.html#Path"><span class="Identifier">Path</span></a>, <a href="pixie/paths.html#lineTo,Path,Vec2"><span class="Identifier">lineTo</span></a>, <a href="pixie/paths.html#ellipse,Path,Vec2,float32,float32"><span class="Identifier">ellipse</span></a>, <a href="pixie/paths.html#quadraticCurveTo,Path,float32,float32,float32,float32"><span class="Identifier">quadraticCurveTo</span></a>, <a href="pixie/paths.html#arcTo,Path,float32,float32,float32,float32,float32"><span class="Identifier">arcTo</span></a>, <a href="pixie/paths.html#moveTo,Path,float32,float32"><span class="Identifier">moveTo</span></a>, <a href="pixie/paths.html#roundedRect,Path,Rect,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#PathCommandKind"><span class="Identifier">PathCommandKind</span></a>, <a href="pixie/paths.html#polygon,Path,float32,float32,float32,int"><span class="Identifier">polygon</span></a>, <a href="pixie/paths.html#strokePath,Image,SomePath,SomeColor,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#transform,Path,Mat3"><span class="Identifier">transform</span></a>, <a href="pixie/paths.html#PathCommand"><span class="Identifier">PathCommand</span></a>, <a href="pixie/paths.html#roundedRect,Path,Vec2,Vec2,float32,float32,float32,float32"><span class="Identifier">roundedRect</span></a>, <a href="pixie/paths.html#rect,Path,Rect"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#fillPath,Image,SomePath,SomeColor,"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#segments.i,seq[Vec2]"><span class="Identifier">segments</span></a>, <a href="pixie/paths.html#closePath,Path"><span class="Identifier">closePath</span></a>, <a href="pixie/paths.html#addPath,Path,Path"><span class="Identifier">addPath</span></a>, <a href="pixie/paths.html#rect,Path,float32,float32,float32,float32"><span class="Identifier">rect</span></a>, <a href="pixie/paths.html#strokePath,Mask,SomePath,float"><span class="Identifier">strokePath</span></a>, <a href="pixie/paths.html#commandsToShapes,Path,float32"><span class="Identifier">commandsToShapes</span></a>, <a href="pixie/paths.html#ellipse,Path,float32,float32,float32,float32"><span class="Identifier">ellipse</span></a>, <a href="pixie/paths.html#WindingRule"><span class="Identifier">WindingRule</span></a>, <a href="pixie/paths.html#fillPath,Mask,SomePath,"><span class="Identifier">fillPath</span></a>, <a href="pixie/paths.html#moveTo,Path,Vec2"><span class="Identifier">moveTo</span></a>, <a href="pixie/paths.html#fillPath,Mask,SomePath"><span class="Identifier">fillPath</span></a>
 </dl></div>
 
   </div>
@@ -538,7 +556,7 @@ Strokes a polygon.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:40 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie.idx b/docs/pixie.idx
index 4ac9293..c17d731 100644
--- a/docs/pixie.idx
+++ b/docs/pixie.idx
@@ -1,35 +1,38 @@
 ffPng	pixie.html#ffPng	FileFormat.ffPng	
 ffBmp	pixie.html#ffBmp	FileFormat.ffBmp	
 ffJpg	pixie.html#ffJpg	FileFormat.ffJpg	
+ffGif	pixie.html#ffGif	FileFormat.ffGif	
 FileFormat	pixie.html#FileFormat	pixie: FileFormat	
+autoStraightAlpha	pixie.html#autoStraightAlpha.c,ColorRGBX	pixie: autoStraightAlpha(c: ColorRGBX): ColorRGBA	
+autoPremultipliedAlpha	pixie.html#autoPremultipliedAlpha.c,ColorRGBA	pixie: autoPremultipliedAlpha(c: ColorRGBA): ColorRGBX	
 decodeImage	pixie.html#decodeImage	pixie: decodeImage(data: string | seq[uint8]): Image	
 readImage	pixie.html#readImage,string	pixie: readImage(filePath: string): Image	
 encodeImage	pixie.html#encodeImage,Image,FileFormat	pixie: encodeImage(image: Image; fileFormat: FileFormat): string	
 writeFile	pixie.html#writeFile,Image,string,FileFormat	pixie: writeFile(image: Image; filePath: string; fileFormat: FileFormat)	
 writeFile	pixie.html#writeFile,Image,string	pixie: writeFile(image: Image; filePath: string)	
-fillRect	pixie.html#fillRect,Image,Rect,ColorRGBA	pixie: fillRect(image: Image; rect: Rect; color: ColorRGBA)	
+fillRect	pixie.html#fillRect,Image,Rect,SomeColor	pixie: fillRect(image: Image; rect: Rect; color: SomeColor)	
 fillRect	pixie.html#fillRect,Mask,Rect	pixie: fillRect(mask: Mask; rect: Rect)	
-strokeRect	pixie.html#strokeRect,Image,Rect,ColorRGBA,float	pixie: strokeRect(image: Image; rect: Rect; color: ColorRGBA; strokeWidth = 1.0)	
+strokeRect	pixie.html#strokeRect,Image,Rect,SomeColor,float	pixie: strokeRect(image: Image; rect: Rect; color: SomeColor; strokeWidth = 1.0)	
 strokeRect	pixie.html#strokeRect,Mask,Rect,float	pixie: strokeRect(mask: Mask; rect: Rect; strokeWidth = 1.0)	
-fillRoundedRect	pixie.html#fillRoundedRect,Image,Rect,float32,float32,float32,float32,ColorRGBA	pixie: fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;\n                color: ColorRGBA)	
-fillRoundedRect	pixie.html#fillRoundedRect,Image,Rect,float32,ColorRGBA	pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA)	
+fillRoundedRect	pixie.html#fillRoundedRect,Image,Rect,float32,float32,float32,float32,SomeColor	pixie: fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;\n                color: SomeColor)	
+fillRoundedRect	pixie.html#fillRoundedRect,Image,Rect,float32,SomeColor	pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor)	
 fillRoundedRect	pixie.html#fillRoundedRect,Mask,Rect,float32,float32,float32,float32	pixie: fillRoundedRect(mask: Mask; rect: Rect; nw, ne, se, sw: float32)	
 fillRoundedRect	pixie.html#fillRoundedRect,Mask,Rect,float32	pixie: fillRoundedRect(mask: Mask; rect: Rect; radius: float32)	
-strokeRoundedRect	pixie.html#strokeRoundedRect,Image,Rect,float32,float32,float32,float32,ColorRGBA,float	pixie: strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;\n                  color: ColorRGBA; strokeWidth = 1.0)	
-strokeRoundedRect	pixie.html#strokeRoundedRect,Image,Rect,float32,ColorRGBA,float	pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA;\n                  strokeWidth = 1.0)	
+strokeRoundedRect	pixie.html#strokeRoundedRect,Image,Rect,float32,float32,float32,float32,SomeColor,float	pixie: strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;\n                  color: SomeColor; strokeWidth = 1.0)	
+strokeRoundedRect	pixie.html#strokeRoundedRect,Image,Rect,float32,SomeColor,float	pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor;\n                  strokeWidth = 1.0)	
 strokeRoundedRect	pixie.html#strokeRoundedRect,Mask,Rect,float32,float32,float32,float32,float	pixie: strokeRoundedRect(mask: Mask; rect: Rect; nw, ne, se, sw: float32;\n                  strokeWidth = 1.0)	
 strokeRoundedRect	pixie.html#strokeRoundedRect,Mask,Rect,float32,float	pixie: strokeRoundedRect(mask: Mask; rect: Rect; radius: float32; strokeWidth = 1.0)	
-strokeSegment	pixie.html#strokeSegment,Image,Segment,ColorRGBA,float	pixie: strokeSegment(image: Image; segment: Segment; color: ColorRGBA;\n              strokeWidth = 1.0)	
+strokeSegment	pixie.html#strokeSegment,Image,Segment,SomeColor,float	pixie: strokeSegment(image: Image; segment: Segment; color: SomeColor;\n              strokeWidth = 1.0)	
 strokeSegment	pixie.html#strokeSegment,Mask,Segment,float32	pixie: strokeSegment(mask: Mask; segment: Segment; strokeWidth: float32)	
-fillEllipse	pixie.html#fillEllipse,Image,Vec2,float32,float32,ColorRGBA	pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;\n            blendMode = bmNormal)	
+fillEllipse	pixie.html#fillEllipse,Image,Vec2,float32,float32,SomeColor	pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;\n            blendMode = bmNormal)	
 fillEllipse	pixie.html#fillEllipse,Mask,Vec2,float32,float32	pixie: fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)	
-strokeEllipse	pixie.html#strokeEllipse,Image,Vec2,float32,float32,ColorRGBA,float	pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;\n              strokeWidth = 1.0)	
+strokeEllipse	pixie.html#strokeEllipse,Image,Vec2,float32,float32,SomeColor,float	pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;\n              strokeWidth = 1.0)	
 strokeEllipse	pixie.html#strokeEllipse,Mask,Vec2,float32,float32,float	pixie: strokeEllipse(mask: Mask; center: Vec2; rx, ry: float32; strokeWidth = 1.0)	
-fillCircle	pixie.html#fillCircle,Image,Vec2,float32,ColorRGBA	pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA)	
+fillCircle	pixie.html#fillCircle,Image,Vec2,float32,SomeColor	pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: SomeColor)	
 fillCircle	pixie.html#fillCircle,Mask,Vec2,float32	pixie: fillCircle(mask: Mask; center: Vec2; radius: float32)	
-strokeCircle	pixie.html#strokeCircle,Image,Vec2,float32,ColorRGBA,float	pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA;\n             strokeWidth = 1.0)	
+strokeCircle	pixie.html#strokeCircle,Image,Vec2,float32,SomeColor,float	pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: SomeColor;\n             strokeWidth = 1.0)	
 strokeCircle	pixie.html#strokeCircle,Mask,Vec2,float32,float	pixie: strokeCircle(mask: Mask; center: Vec2; radius: float32; strokeWidth = 1.0)	
-fillPolygon	pixie.html#fillPolygon,Image,Vec2,float32,int,ColorRGBA	pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: ColorRGBA)	
+fillPolygon	pixie.html#fillPolygon,Image,Vec2,float32,int,SomeColor	pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: SomeColor)	
 fillPolygon	pixie.html#fillPolygon,Mask,Vec2,float32,int	pixie: fillPolygon(mask: Mask; pos: Vec2; size: float32; sides: int)	
-strokePolygon	pixie.html#strokePolygon,Image,Vec2,float32,int,ColorRGBA,float	pixie: strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;\n              color: ColorRGBA; strokeWidth = 1.0)	
+strokePolygon	pixie.html#strokePolygon,Image,Vec2,float32,int,SomeColor,float	pixie: strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;\n              color: SomeColor; strokeWidth = 1.0)	
 strokePolygon	pixie.html#strokePolygon,Mask,Vec2,float32,int,float	pixie: strokePolygon(mask: Mask; pos: Vec2; size: float32; sides: int;\n              strokeWidth = 1.0)	
diff --git a/docs/pixie/blends.html b/docs/pixie/blends.html
index 8138be0..0b2ac40 100644
--- a/docs/pixie/blends.html
+++ b/docs/pixie/blends.html
@@ -283,7 +283,7 @@ Is there a blend masking function with SIMD support?
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/common.html b/docs/pixie/common.html
index d2951b0..87fdee2 100644
--- a/docs/pixie/common.html
+++ b/docs/pixie/common.html
@@ -196,7 +196,7 @@ Linearly interpolate between a and b using t.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/fileformats/bmp.html b/docs/pixie/fileformats/bmp.html
index f01f240..0d49704 100644
--- a/docs/pixie/fileformats/bmp.html
+++ b/docs/pixie/fileformats/bmp.html
@@ -182,7 +182,7 @@ Encodes an image into the BMP file format.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/fileformats/gif.html b/docs/pixie/fileformats/gif.html
new file mode 100644
index 0000000..1dad08b
--- /dev/null
+++ b/docs/pixie/fileformats/gif.html
@@ -0,0 +1,171 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!--  This file is generated by Nim. -->
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+<!-- Favicon -->
+<link rel="shortcut icon" href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AAAAAAUAAAAF////AP///wD///8A////AP///wD///8A////AP///wD///8A////AAAAAAIAAABbAAAAlQAAAKIAAACbAAAAmwAAAKIAAACVAAAAWwAAAAL///8A////AP///wD///8A////AAAAABQAAADAAAAAYwAAAA3///8A////AP///wD///8AAAAADQAAAGMAAADAAAAAFP///wD///8A////AP///wAAAACdAAAAOv///wD///8A////AP///wD///8A////AP///wD///8AAAAAOgAAAJ3///8A////AP///wAAAAAnAAAAcP///wAAAAAoAAAASv///wD///8A////AP///wAAAABKAAAAKP///wAAAABwAAAAJ////wD///8AAAAAgQAAABwAAACIAAAAkAAAAJMAAACtAAAAFQAAABUAAACtAAAAkwAAAJAAAACIAAAAHAAAAIH///8A////AAAAAKQAAACrAAAAaP///wD///8AAAAARQAAANIAAADSAAAARf///wD///8AAAAAaAAAAKsAAACk////AAAAADMAAACcAAAAnQAAABj///8A////AP///wAAAAAYAAAAGP///wD///8A////AAAAABgAAACdAAAAnAAAADMAAAB1AAAAwwAAAP8AAADpAAAAsQAAAE4AAAAb////AP///wAAAAAbAAAATgAAALEAAADpAAAA/wAAAMMAAAB1AAAAtwAAAOkAAAD/AAAA/wAAAP8AAADvAAAA3gAAAN4AAADeAAAA3gAAAO8AAAD/AAAA/wAAAP8AAADpAAAAtwAAAGUAAAA/AAAA3wAAAP8AAAD/AAAA/wAAAP8AAAD/AAAA/wAAAP8AAAD/AAAA/wAAAP8AAADfAAAAPwAAAGX///8A////AAAAAEgAAADtAAAAvwAAAL0AAADGAAAA7wAAAO8AAADGAAAAvQAAAL8AAADtAAAASP///wD///8A////AP///wD///8AAAAAO////wD///8A////AAAAAIcAAACH////AP///wD///8AAAAAO////wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A//8AAP//AAD4HwAA7/cAAN/7AAD//wAAoYUAAJ55AACf+QAAh+EAAAAAAADAAwAA4AcAAP5/AAD//wAA//8AAA=="/>
+<link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAA3XAAAN1wFCKJt4AAAAB3RJTUUH4QQQEwksSS9ZWwAAAk1JREFUWMPtll2ITVEUx39nn/O7Y5qR8f05wtCUUr6ZIS++8pEnkZInPImneaCQ5METNdOkeFBKUhMPRIkHKfEuUZSUlGlKPN2TrgfncpvmnntnmlEyq1Z7t89/rf9a6+y99oZxGZf/XeIq61EdtgKXgdXA0xrYAvBjOIF1AI9zvjcC74BSpndrJPkBWDScTF8Aa4E3wDlgHbASaANmVqlcCnwHvgDvgVfAJ+AikAAvgfVZwLnSVZHZaOuKoQi3ZOMi4NkYkpe1p4J7A8BpYAD49hfIy/oqG0+hLomiKP2L5L+1ubn5115S+3OAn4EnwBlgMzCjyt6ZAnQCJ4A7wOs88iRJHvw50HoujuPBoCKwHWiosy8MdfZnAdcHk8dxXFJ3VQbQlCTJvRBCGdRbD4M6uc5glpY3eAihpN5S5w12diSEcCCEcKUO4ljdr15T76ur1FDDLIQQ3qv71EdDOe3Kxj3leRXyk+pxdWnFWod6Wt2bY3de3aSuUHcPBVimHs7mK9WrmeOF6lR1o9qnzskh2ar2qm1qizpfXaPeVGdlmGN5pb09qMxz1Xb1kLqgzn1RyH7JUXW52lr5e/Kqi9qpto7V1atuUzfnARrV7jEib1T76gG2qxdGmXyiekkt1GswPTtek0aBfJp6YySGBfWg2tPQ0FAYgf1stUfdmdcjarbYJEniKIq6gY/Aw+zWHAC+p2labGpqiorFYgGYCEzN7oQdQClN07O1/EfDyGgC0ALMBdYAi4FyK+4H3gLPsxfR1zRNi+NP7nH5J+QntnXe5B5mpfQAAAAASUVORK5CYII=">
+
+<!-- Google fonts -->
+<link href='https://fonts.googleapis.com/css?family=Lato:400,600,900' rel='stylesheet' type='text/css'/>
+<link href='https://fonts.googleapis.com/css?family=Source+Code+Pro:400,500,600' rel='stylesheet' type='text/css'/>
+
+<!-- CSS -->
+<title>pixie/fileformats/gif</title>
+<link rel="stylesheet" type="text/css" href="../../nimdoc.out.css">
+
+<script type="text/javascript" src="../../dochack.js"></script>
+
+<script type="text/javascript">
+function main() {
+  var pragmaDots = document.getElementsByClassName("pragmadots");
+  for (var i = 0; i < pragmaDots.length; i++) {
+    pragmaDots[i].onclick = function(event) {
+      // Hide tease
+      event.target.parentNode.style.display = "none";
+      // Show actual
+      event.target.parentNode.nextElementSibling.style.display = "inline";
+    }
+  }
+
+  const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
+  function switchTheme(e) {
+      if (e.target.checked) {
+          document.documentElement.setAttribute('data-theme', 'dark');
+          localStorage.setItem('theme', 'dark');
+      } else {
+          document.documentElement.setAttribute('data-theme', 'light');
+          localStorage.setItem('theme', 'light');
+      }
+  }
+
+  toggleSwitch.addEventListener('change', switchTheme, false);
+
+  const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
+  if (currentTheme) {
+    document.documentElement.setAttribute('data-theme', currentTheme);
+
+    if (currentTheme === 'dark') {
+      toggleSwitch.checked = true;
+    }
+  }
+}
+</script>
+
+</head>
+<body onload="main()">
+<div class="document" id="documentId">
+  <div class="container">
+    <h1 class="title">pixie/fileformats/gif</h1>
+    <div class="row">
+  <div class="three columns">
+  <div class="theme-switch-wrapper">
+    <label class="theme-switch" for="checkbox">
+      <input type="checkbox" id="checkbox" />
+      <div class="slider round"></div>
+    </label>
+    &nbsp;&nbsp;&nbsp; <em>Dark Mode</em>
+  </div>
+  <div id="global-links">
+    <ul class="simple">
+    <li>
+      <a href="../../theindex.html">Index</a>
+    </li>
+    </ul>
+  </div>
+  <div id="searchInputDiv">
+    Search: <input type="text" id="searchInput"
+      onkeyup="search()" />
+  </div>
+  <div>
+    Group by:
+    <select onchange="groupBy(this.value)">
+      <option value="section">Section</option>
+      <option value="type">Type</option>
+    </select>
+  </div>
+  <ul class="simple simple-toc" id="toc-list">
+<li>
+  <a class="reference reference-toplevel" href="#6" id="56">Imports</a>
+  <ul class="simple simple-toc-section">
+    
+  </ul>
+</li>
+<li>
+  <a class="reference reference-toplevel" href="#10" id="60">Consts</a>
+  <ul class="simple simple-toc-section">
+      <li><a class="reference" href="#gifSignatures"
+    title="gifSignatures = [&quot;GIF87a&quot;, &quot;GIF89a&quot;]">gifSignatures</a></li>
+
+  </ul>
+</li>
+<li>
+  <a class="reference reference-toplevel" href="#12" id="62">Procs</a>
+  <ul class="simple simple-toc-section">
+      <ul class="simple nested-toc-section">decodeGif
+      <li><a class="reference" href="#decodeGif%2Cstring"
+    title="decodeGif(data: string): Image">decodeGif,<wbr>string</a></li>
+
+  </ul>
+
+  </ul>
+</li>
+
+</ul>
+
+  </div>
+  <div class="nine columns" id="content">
+  <div id="tocRoot"></div>
+  
+  <p class="module-desc"></p>
+  <div class="section" id="6">
+<h1><a class="toc-backref" href="#6">Imports</a></h1>
+<dl class="item">
+<a class="reference external" href="../common.html">../common</a>, <a class="reference external" href="../images.html">../images</a>
+</dl></div>
+<div class="section" id="10">
+<h1><a class="toc-backref" href="#10">Consts</a></h1>
+<dl class="item">
+<a id="gifSignatures"></a>
+<dt><pre><a href="gif.html#gifSignatures"><span class="Identifier">gifSignatures</span></a> <span class="Other">=</span> <span class="Other">[</span><span class="StringLit">&quot;GIF87a&quot;</span><span class="Other">,</span> <span class="StringLit">&quot;GIF89a&quot;</span><span class="Other">]</span></pre></dt>
+<dd>
+
+
+
+</dd>
+
+</dl></div>
+<div class="section" id="12">
+<h1><a class="toc-backref" href="#12">Procs</a></h1>
+<dl class="item">
+<a id="decodeGif,string"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#decodeGif%2Cstring"><span class="Identifier">decodeGif</span></a><span class="Other">(</span><span class="Identifier">data</span><span class="Other">:</span> <span class="Identifier">string</span><span class="Other">)</span><span class="Other">:</span> <a href="../images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<dd>
+
+Decodes GIF data into an Image.
+
+</dd>
+
+</dl></div>
+
+  </div>
+</div>
+
+    <div class="row">
+      <div class="twelve-columns footer">
+        <span class="nim-sprite"></span>
+        <br/>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
+      </div>
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
diff --git a/docs/pixie/fileformats/gif.idx b/docs/pixie/fileformats/gif.idx
new file mode 100644
index 0000000..a237e3d
--- /dev/null
+++ b/docs/pixie/fileformats/gif.idx
@@ -0,0 +1,2 @@
+gifSignatures	pixie/fileformats/gif.html#gifSignatures	gif: gifSignatures	
+decodeGif	pixie/fileformats/gif.html#decodeGif,string	gif: decodeGif(data: string): Image	
diff --git a/docs/pixie/fileformats/jpg.html b/docs/pixie/fileformats/jpg.html
index dd1e33c..fee3d34 100644
--- a/docs/pixie/fileformats/jpg.html
+++ b/docs/pixie/fileformats/jpg.html
@@ -182,7 +182,7 @@ Encodes Image into a JPEG data string.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/fileformats/png.html b/docs/pixie/fileformats/png.html
index 44d606a..784785d 100644
--- a/docs/pixie/fileformats/png.html
+++ b/docs/pixie/fileformats/png.html
@@ -138,7 +138,7 @@ function main() {
   <div class="section" id="6">
 <h1><a class="toc-backref" href="#6">Imports</a></h1>
 <dl class="item">
-<a class="reference external" href="../common.html">../common</a>, <a class="reference external" href="../images.html">../images</a>, <a class="reference external" href="../masks.html">../masks</a>, <a class="reference external" href="../internal.html">../internal</a>
+<a class="reference external" href="../common.html">../common</a>, <a class="reference external" href="../images.html">../images</a>, <a class="reference external" href="../internal.html">../internal</a>, <a class="reference external" href="../masks.html">../masks</a>
 </dl></div>
 <div class="section" id="10">
 <h1><a class="toc-backref" href="#10">Consts</a></h1>
@@ -201,7 +201,7 @@ Encodes the mask data into the PNG file format.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/fileformats/svg.html b/docs/pixie/fileformats/svg.html
index e9a53b3..6fc809b 100644
--- a/docs/pixie/fileformats/svg.html
+++ b/docs/pixie/fileformats/svg.html
@@ -171,7 +171,7 @@ Render SVG file and return the image. Defaults to the SVG's view box size.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:40 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/images.html b/docs/pixie/images.html
index ae96312..8698aeb 100644
--- a/docs/pixie/images.html
+++ b/docs/pixie/images.html
@@ -145,8 +145,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">setRgbaUnsafe
-      <li><a class="reference" href="#setRgbaUnsafe%2CImage%2Cint%2Cint%2CColorRGBX"
-    title="setRgbaUnsafe(image: Image; x, y: int; rgba: ColorRGBX)">setRgbaUnsafe,<wbr>Image,<wbr>int,<wbr>int,<wbr>ColorRGBX</a></li>
+      <li><a class="reference" href="#setRgbaUnsafe%2CImage%2Cint%2Cint%2CSomeColor"
+    title="setRgbaUnsafe(image: Image; x, y: int; color: SomeColor)">setRgbaUnsafe,<wbr>Image,<wbr>int,<wbr>int,<wbr>SomeColor</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">shift
@@ -155,8 +155,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">[]=
-      <li><a class="reference" href="#%5B%5D%3D%2CImage%2Cint%2Cint%2CColorRGBX"
-    title="`[]=`(image: Image; x, y: int; rgba: ColorRGBX)">[]=,<wbr>Image,<wbr>int,<wbr>int,<wbr>ColorRGBX</a></li>
+      <li><a class="reference" href="#%5B%5D%3D%2CImage%2Cint%2Cint%2CSomeColor"
+    title="`[]=`(image: Image; x, y: int; color: SomeColor)">[]=,<wbr>Image,<wbr>int,<wbr>int,<wbr>SomeColor</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">invert
@@ -175,8 +175,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">fill
-      <li><a class="reference" href="#fill%2CImage%2CColorRGBX"
-    title="fill(image: Image; rgba: ColorRGBX)">fill,<wbr>Image,<wbr>ColorRGBX</a></li>
+      <li><a class="reference" href="#fill%2CImage%2CSomeColor"
+    title="fill(image: Image; color: SomeColor)">fill,<wbr>Image,<wbr>SomeColor</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">wh
@@ -200,8 +200,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">shadow
-      <li><a class="reference" href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBX"
-    title="shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBX): Image">shadow,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>ColorRGBX</a></li>
+      <li><a class="reference" href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor"
+    title="shadow(image: Image; offset: Vec2; spread, blur: float32; color: SomeColor): Image">shadow,<wbr>Image,<wbr>Vec2,<wbr>float32,<wbr>float32,<wbr>SomeColor</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">newMask
@@ -235,8 +235,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">blur
-      <li><a class="reference" href="#blur%2CImage%2Cfloat32"
-    title="blur(image: Image; radius: float32; outOfBounds = ColorRGBX())">blur,<wbr>Image,<wbr>float32</a></li>
+      <li><a class="reference" href="#blur%2CImage%2Cfloat32%2CSomeColor"
+    title="blur(image: Image; radius: float32; outOfBounds: SomeColor = ColorRGBX())">blur,<wbr>Image,<wbr>float32,<wbr>SomeColor</a></li>
 
   </ul>
   <ul class="simple nested-toc-section">dataIndex
@@ -265,8 +265,8 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">fillUnsafe
-      <li><a class="reference" href="#fillUnsafe%2Cseq%5BColorRGBX%5D%2CColorRGBX%2Cint%2Cint"
-    title="fillUnsafe(data: var seq[ColorRGBX]; rgba: ColorRGBX; start, len: int)">fillUnsafe,<wbr>seq[ColorRGBX],<wbr>ColorRGBX,<wbr>int,<wbr>int</a></li>
+      <li><a class="reference" href="#fillUnsafe%2Cseq%5BColorRGBX%5D%2CSomeColor%2Cint%2Cint"
+    title="fillUnsafe(data: var seq[ColorRGBX]; color: SomeColor; start, len: int)">fillUnsafe,<wbr>seq[ColorRGBX],<wbr>SomeColor,<wbr>int,<wbr>int</a></li>
 
   </ul>
 
@@ -363,9 +363,8 @@ Gets a color from (x, y) coordinates.<ul class="simple"><li>No bounds checking *
 Gets a pixel at (x, y) or returns transparent black if outside of bounds.
 
 </dd>
-<a id="setRgbaUnsafe,Image,int,int,ColorRGBX"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#setRgbaUnsafe%2CImage%2Cint%2Cint%2CColorRGBX"><span class="Identifier">setRgbaUnsafe</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span> <span class="Identifier">rgba</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span>
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="setRgbaUnsafe,Image,int,int,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#setRgbaUnsafe%2CImage%2Cint%2Cint%2CSomeColor"><span class="Identifier">setRgbaUnsafe</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span></span><span class="Other">.}</span></span></pre></dt>
 <dd>
 
 Sets a color from (x, y) coordinates.<ul class="simple"><li>No bounds checking *</li>
@@ -374,24 +373,22 @@ Sets a color from (x, y) coordinates.<ul class="simple"><li>No bounds checking *
 
 
 </dd>
-<a id="[]=,Image,int,int,ColorRGBX"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#%5B%5D%3D%2CImage%2Cint%2Cint%2CColorRGBX"><span class="Identifier">`[]=`</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span> <span class="Identifier">rgba</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span>
-    <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="[]=,Image,int,int,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#%5B%5D%3D%2CImage%2Cint%2Cint%2CSomeColor"><span class="Identifier">`[]=`</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">x</span><span class="Other">,</span> <span class="Identifier">y</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span></span><span class="Other">.}</span></span></pre></dt>
 <dd>
 
 Sets a pixel at (x, y) or does nothing if outside of bounds.
 
 </dd>
-<a id="fillUnsafe,seq[ColorRGBX],ColorRGBX,int,int"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillUnsafe%2Cseq%5BColorRGBX%5D%2CColorRGBX%2Cint%2Cint"><span class="Identifier">fillUnsafe</span></a><span class="Other">(</span><span class="Identifier">data</span><span class="Other">:</span> <span class="Keyword">var</span> <span class="Identifier">seq</span><span class="Other">[</span><span class="Identifier">ColorRGBX</span><span class="Other">]</span><span class="Other">;</span> <span class="Identifier">rgba</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">;</span> <span class="Identifier">start</span><span class="Other">,</span> <span class="Identifier">len</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fillUnsafe,seq[ColorRGBX],SomeColor,int,int"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillUnsafe%2Cseq%5BColorRGBX%5D%2CSomeColor%2Cint%2Cint"><span class="Identifier">fillUnsafe</span></a><span class="Other">(</span><span class="Identifier">data</span><span class="Other">:</span> <span class="Keyword">var</span> <span class="Identifier">seq</span><span class="Other">[</span><span class="Identifier">ColorRGBX</span><span class="Other">]</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span> <span class="Identifier">start</span><span class="Other">,</span> <span class="Identifier">len</span><span class="Other">:</span> <span class="Identifier">int</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Fills the image data with the parameter color starting at index start and continuing for len indices.
 
 </dd>
-<a id="fill,Image,ColorRGBX"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fill%2CImage%2CColorRGBX"><span class="Identifier">fill</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">rgba</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span><span class="Other">,</span> <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="fill,Image,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fill%2CImage%2CSomeColor"><span class="Identifier">fill</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span></span><span class="Other">.}</span></span></pre></dt>
 <dd>
 
 Fills the image with the parameter color.
@@ -463,9 +460,8 @@ Multiplies alpha of the image by opacity.
 Inverts all of the colors and alpha.
 
 </dd>
-<a id="blur,Image,float32"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#blur%2CImage%2Cfloat32"><span class="Identifier">blur</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">outOfBounds</span> <span class="Other">=</span> <span class="Identifier">ColorRGBX</span><span class="Other">(</span><span class="Other">)</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="blur,Image,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#blur%2CImage%2Cfloat32%2CSomeColor"><span class="Identifier">blur</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">radius</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">outOfBounds</span><span class="Other">:</span> <span class="Identifier">SomeColor</span> <span class="Other">=</span> <span class="Identifier">ColorRGBX</span><span class="Other">(</span><span class="Other">)</span><span class="Other">)</span></pre></dt>
 <dd>
 
 Applies Gaussian blur to the image given a radius.
@@ -573,9 +569,8 @@ Resize an image to a given hight and width.
 Shifts the target by offset.
 
 </dd>
-<a id="shadow,Image,Vec2,float32,float32,ColorRGBX"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBX"><span class="Identifier">shadow</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">offset</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">spread</span><span class="Other">,</span> <span class="Identifier">blur</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">)</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma">
-    <span class="Identifier">raises</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">PixieError</span><span class="Other">,</span> <span class="Identifier">Exception</span><span class="Other">]</span><span class="Other">,</span> <span class="Identifier">tags</span><span class="Other">:</span> <span class="Other">[</span><span class="Identifier">RootEffect</span><span class="Other">]</span></span><span class="Other">.}</span></span></pre></dt>
+<a id="shadow,Image,Vec2,float32,float32,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor"><span class="Identifier">shadow</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">offset</span><span class="Other">:</span> <span class="Identifier">Vec2</span><span class="Other">;</span> <span class="Identifier">spread</span><span class="Other">,</span> <span class="Identifier">blur</span><span class="Other">:</span> <span class="Identifier">float32</span><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">)</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a></pre></dt>
 <dd>
 
 Create a shadow of the image with the offset, spread and blur.
@@ -591,7 +586,7 @@ Create a shadow of the image with the offset, spread and blur.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/images.idx b/docs/pixie/images.idx
index 1711bff..dc50dd8 100644
--- a/docs/pixie/images.idx
+++ b/docs/pixie/images.idx
@@ -7,10 +7,10 @@ inside	pixie/images.html#inside,Image,int,int	images: inside(image: Image; x, y:
 dataIndex	pixie/images.html#dataIndex,Image,int,int	images: dataIndex(image: Image; x, y: int): int	
 getRgbaUnsafe	pixie/images.html#getRgbaUnsafe,Image,int,int	images: getRgbaUnsafe(image: Image; x, y: int): ColorRGBX	
 `[]`	pixie/images.html#[],Image,int,int	images: `[]`(image: Image; x, y: int): ColorRGBX	
-setRgbaUnsafe	pixie/images.html#setRgbaUnsafe,Image,int,int,ColorRGBX	images: setRgbaUnsafe(image: Image; x, y: int; rgba: ColorRGBX)	
-`[]=`	pixie/images.html#[]=,Image,int,int,ColorRGBX	images: `[]=`(image: Image; x, y: int; rgba: ColorRGBX)	
-fillUnsafe	pixie/images.html#fillUnsafe,seq[ColorRGBX],ColorRGBX,int,int	images: fillUnsafe(data: var seq[ColorRGBX]; rgba: ColorRGBX; start, len: int)	
-fill	pixie/images.html#fill,Image,ColorRGBX	images: fill(image: Image; rgba: ColorRGBX)	
+setRgbaUnsafe	pixie/images.html#setRgbaUnsafe,Image,int,int,SomeColor	images: setRgbaUnsafe(image: Image; x, y: int; color: SomeColor)	
+`[]=`	pixie/images.html#[]=,Image,int,int,SomeColor	images: `[]=`(image: Image; x, y: int; color: SomeColor)	
+fillUnsafe	pixie/images.html#fillUnsafe,seq[ColorRGBX],SomeColor,int,int	images: fillUnsafe(data: var seq[ColorRGBX]; color: SomeColor; start, len: int)	
+fill	pixie/images.html#fill,Image,SomeColor	images: fill(image: Image; color: SomeColor)	
 flipHorizontal	pixie/images.html#flipHorizontal,Image	images: flipHorizontal(image: Image)	
 flipVertical	pixie/images.html#flipVertical,Image	images: flipVertical(image: Image)	
 subImage	pixie/images.html#subImage,Image,int,int,int,int	images: subImage(image: Image; x, y, w, h: int): Image	
@@ -20,7 +20,7 @@ minifyBy2	pixie/images.html#minifyBy2,Image,int	images: minifyBy2(image: Image;
 magnifyBy2	pixie/images.html#magnifyBy2,Image,int	images: magnifyBy2(image: Image; power = 1): Image	
 applyOpacity	pixie/images.html#applyOpacity,,float32	images: applyOpacity(target: Image | Mask; opacity: float32)	
 invert	pixie/images.html#invert	images: invert(target: Image | Mask)	
-blur	pixie/images.html#blur,Image,float32	images: blur(image: Image; radius: float32; outOfBounds = ColorRGBX())	
+blur	pixie/images.html#blur,Image,float32,SomeColor	images: blur(image: Image; radius: float32; outOfBounds: SomeColor = ColorRGBX())	
 newMask	pixie/images.html#newMask,Image	images: newMask(image: Image): Mask	
 getRgbaSmooth	pixie/images.html#getRgbaSmooth,Image,float32,float32	images: getRgbaSmooth(image: Image; x, y: float32; wrapped = false): ColorRGBX	
 draw	pixie/images.html#draw,Image,Image,Mat3	images: draw(a, b: Image; mat: Mat3; blendMode = bmNormal)	
@@ -34,4 +34,4 @@ draw	pixie/images.html#draw,Mask,Image	images: draw(mask: Mask; image: Image; po
 drawTiled	pixie/images.html#drawTiled,Image,Image,Mat3	images: drawTiled(dest, src: Image; mat: Mat3; blendMode = bmNormal)	
 resize	pixie/images.html#resize,Image,int,int	images: resize(srcImage: Image; width, height: int): Image	
 shift	pixie/images.html#shift,,Vec2	images: shift(target: Image | Mask; offset: Vec2)	
-shadow	pixie/images.html#shadow,Image,Vec2,float32,float32,ColorRGBX	images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBX): Image	
+shadow	pixie/images.html#shadow,Image,Vec2,float32,float32,SomeColor	images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: SomeColor): Image	
diff --git a/docs/pixie/internal.html b/docs/pixie/internal.html
index b8b2879..c40eb42 100644
--- a/docs/pixie/internal.html
+++ b/docs/pixie/internal.html
@@ -178,7 +178,7 @@ Unpack the first 32 bits into 4 rgba(0, 0, 0, value)
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/masks.html b/docs/pixie/masks.html
index 2b3ac01..4af957d 100644
--- a/docs/pixie/masks.html
+++ b/docs/pixie/masks.html
@@ -367,7 +367,7 @@ Applies Gaussian blur to the image given a radius.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/paints.html b/docs/pixie/paints.html
index 72b6061..a63ea80 100644
--- a/docs/pixie/paints.html
+++ b/docs/pixie/paints.html
@@ -243,7 +243,7 @@ Angular gradient.
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/paths.html b/docs/pixie/paths.html
index 98863bf..d0ca581 100644
--- a/docs/pixie/paths.html
+++ b/docs/pixie/paths.html
@@ -152,13 +152,13 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">strokePath
-      <li><a class="reference" href="#strokePath%2CImage%2CSomePath%2CColorRGBX%2Cfloat"
-    title="strokePath(image: Image; path: SomePath; color: ColorRGBX; strokeWidth = 1.0;
-           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)">strokePath,<wbr>Image,<wbr>SomePath,<wbr>ColorRGBX,<wbr>float</a></li>
-  <li><a class="reference" href="#strokePath%2CImage%2CSomePath%2CColorRGBX%2C%2Cfloat"
-    title="strokePath(image: Image; path: SomePath; color: ColorRGBX;
+      <li><a class="reference" href="#strokePath%2CImage%2CSomePath%2CSomeColor%2Cfloat"
+    title="strokePath(image: Image; path: SomePath; color: SomeColor; strokeWidth = 1.0;
+           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)">strokePath,<wbr>Image,<wbr>SomePath,<wbr>SomeColor,<wbr>float</a></li>
+  <li><a class="reference" href="#strokePath%2CImage%2CSomePath%2CSomeColor%2C%2Cfloat"
+    title="strokePath(image: Image; path: SomePath; color: SomeColor;
            transform: Vec2 | Mat3; strokeWidth = 1.0; lineCap = lcButt;
-           lineJoin = ljMiter; blendMode = bmNormal)">strokePath,<wbr>Image,<wbr>SomePath,<wbr>ColorRGBX,<wbr>,<wbr>float</a></li>
+           lineJoin = ljMiter; blendMode = bmNormal)">strokePath,<wbr>Image,<wbr>SomePath,<wbr>SomeColor,<wbr>,<wbr>float</a></li>
   <li><a class="reference" href="#strokePath%2CMask%2CSomePath%2Cfloat"
     title="strokePath(mask: Mask; path: SomePath; strokeWidth = 1.0; lineCap = lcButt;
            lineJoin = ljMiter)">strokePath,<wbr>Mask,<wbr>SomePath,<wbr>float</a></li>
@@ -252,12 +252,12 @@ function main() {
 
   </ul>
   <ul class="simple nested-toc-section">fillPath
-      <li><a class="reference" href="#fillPath%2CImage%2CSomePath%2CColorRGBX"
-    title="fillPath(image: Image; path: SomePath; color: ColorRGBX;
-         windingRule = wrNonZero; blendMode = bmNormal)">fillPath,<wbr>Image,<wbr>SomePath,<wbr>ColorRGBX</a></li>
-  <li><a class="reference" href="#fillPath%2CImage%2CSomePath%2CColorRGBX%2C"
-    title="fillPath(image: Image; path: SomePath; color: ColorRGBX; transform: Vec2 | Mat3;
-         windingRule = wrNonZero; blendMode = bmNormal)">fillPath,<wbr>Image,<wbr>SomePath,<wbr>ColorRGBX,<wbr></a></li>
+      <li><a class="reference" href="#fillPath%2CImage%2CSomePath%2CSomeColor"
+    title="fillPath(image: Image; path: SomePath; color: SomeColor;
+         windingRule = wrNonZero; blendMode = bmNormal)">fillPath,<wbr>Image,<wbr>SomePath,<wbr>SomeColor</a></li>
+  <li><a class="reference" href="#fillPath%2CImage%2CSomePath%2CSomeColor%2C"
+    title="fillPath(image: Image; path: SomePath; color: SomeColor; transform: Vec2 | Mat3;
+         windingRule = wrNonZero; blendMode = bmNormal)">fillPath,<wbr>Image,<wbr>SomePath,<wbr>SomeColor,<wbr></a></li>
   <li><a class="reference" href="#fillPath%2CMask%2CSomePath"
     title="fillPath(mask: Mask; path: SomePath; windingRule = wrNonZero)">fillPath,<wbr>Mask,<wbr>SomePath</a></li>
   <li><a class="reference" href="#fillPath%2CMask%2CSomePath%2C"
@@ -566,16 +566,16 @@ Draws a n-sided regular polygon at (x, y) with the parameter size.
 Converts SVG-like commands to line segments.
 
 </dd>
-<a id="fillPath,Image,SomePath,ColorRGBX"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillPath%2CImage%2CSomePath%2CColorRGBX"><span class="Identifier">fillPath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">;</span>
+<a id="fillPath,Image,SomePath,SomeColor"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillPath%2CImage%2CSomePath%2CSomeColor"><span class="Identifier">fillPath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
               <span class="Identifier">windingRule</span> <span class="Other">=</span> <span class="Identifier">wrNonZero</span><span class="Other">;</span> <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span> <span><span class="Other">{</span><span class="Other pragmadots">...</span><span class="Other">}</span></span><span class="pragmawrap"><span class="Other">{.</span><span class="pragma"><span class="Identifier">inline</span></span><span class="Other">.}</span></span></pre></dt>
 <dd>
 
 Fills a path.
 
 </dd>
-<a id="fillPath,Image,SomePath,ColorRGBX,"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#fillPath%2CImage%2CSomePath%2CColorRGBX%2C"><span class="Identifier">fillPath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">;</span>
+<a id="fillPath,Image,SomePath,SomeColor,"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#fillPath%2CImage%2CSomePath%2CSomeColor%2C"><span class="Identifier">fillPath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
               <span class="Identifier">transform</span><span class="Other">:</span> <span class="Identifier">Vec2</span> <span class="Operator">|</span> <span class="Identifier">Mat3</span><span class="Other">;</span> <span class="Identifier">windingRule</span> <span class="Other">=</span> <span class="Identifier">wrNonZero</span><span class="Other">;</span>
               <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span></pre></dt>
 <dd>
@@ -606,8 +606,8 @@ Fills a path.
 Fills a path.
 
 </dd>
-<a id="strokePath,Image,SomePath,ColorRGBX,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokePath%2CImage%2CSomePath%2CColorRGBX%2Cfloat"><span class="Identifier">strokePath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">;</span>
+<a id="strokePath,Image,SomePath,SomeColor,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokePath%2CImage%2CSomePath%2CSomeColor%2Cfloat"><span class="Identifier">strokePath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
                 <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">;</span> <span class="Identifier">lineCap</span> <span class="Other">=</span> <span class="Identifier">lcButt</span><span class="Other">;</span> <span class="Identifier">lineJoin</span> <span class="Other">=</span> <span class="Identifier">ljMiter</span><span class="Other">;</span>
                 <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span></pre></dt>
 <dd>
@@ -615,8 +615,8 @@ Fills a path.
 Strokes a path.
 
 </dd>
-<a id="strokePath,Image,SomePath,ColorRGBX,,float"></a>
-<dt><pre><span class="Keyword">proc</span> <a href="#strokePath%2CImage%2CSomePath%2CColorRGBX%2C%2Cfloat"><span class="Identifier">strokePath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">ColorRGBX</span><span class="Other">;</span>
+<a id="strokePath,Image,SomePath,SomeColor,,float"></a>
+<dt><pre><span class="Keyword">proc</span> <a href="#strokePath%2CImage%2CSomePath%2CSomeColor%2C%2Cfloat"><span class="Identifier">strokePath</span></a><span class="Other">(</span><span class="Identifier">image</span><span class="Other">:</span> <a href="images.html#Image"><span class="Identifier">Image</span></a><span class="Other">;</span> <span class="Identifier">path</span><span class="Other">:</span> <a href="paths.html#SomePath"><span class="Identifier">SomePath</span></a><span class="Other">;</span> <span class="Identifier">color</span><span class="Other">:</span> <span class="Identifier">SomeColor</span><span class="Other">;</span>
                 <span class="Identifier">transform</span><span class="Other">:</span> <span class="Identifier">Vec2</span> <span class="Operator">|</span> <span class="Identifier">Mat3</span><span class="Other">;</span> <span class="Identifier">strokeWidth</span> <span class="Other">=</span> <span class="FloatNumber">1.0</span><span class="Other">;</span> <span class="Identifier">lineCap</span> <span class="Other">=</span> <span class="Identifier">lcButt</span><span class="Other">;</span>
                 <span class="Identifier">lineJoin</span> <span class="Other">=</span> <span class="Identifier">ljMiter</span><span class="Other">;</span> <span class="Identifier">blendMode</span> <span class="Other">=</span> <span class="Identifier">bmNormal</span><span class="Other">)</span></pre></dt>
 <dd>
@@ -662,7 +662,7 @@ Return elements in pairs: (1st, 2nd), (2nd, 3rd) ... (n - 1, last).
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:39 UTC</small>
       </div>
     </div>
   </div>
diff --git a/docs/pixie/paths.idx b/docs/pixie/paths.idx
index aa48648..b74e56f 100644
--- a/docs/pixie/paths.idx
+++ b/docs/pixie/paths.idx
@@ -60,12 +60,12 @@ polygon	pixie/paths.html#polygon,Path,float32,float32,float32,int	paths: polygon
 polygon	pixie/paths.html#polygon,Path,Vec2,float32,int	paths: polygon(path: var Path; pos: Vec2; size: float32; sides: int)	
 commandsToShapes	pixie/paths.html#commandsToShapes,Path,float32	paths: commandsToShapes(path: Path; pixelScale: float32 = 1.0): seq[seq[Vec2]]	
 segments	pixie/paths.html#segments.i,seq[Vec2]	paths: segments(s: seq[Vec2]): Segment	
-fillPath	pixie/paths.html#fillPath,Image,SomePath,ColorRGBX	paths: fillPath(image: Image; path: SomePath; color: ColorRGBX;\n         windingRule = wrNonZero; blendMode = bmNormal)	
-fillPath	pixie/paths.html#fillPath,Image,SomePath,ColorRGBX,	paths: fillPath(image: Image; path: SomePath; color: ColorRGBX; transform: Vec2 | Mat3;\n         windingRule = wrNonZero; blendMode = bmNormal)	
+fillPath	pixie/paths.html#fillPath,Image,SomePath,SomeColor	paths: fillPath(image: Image; path: SomePath; color: SomeColor;\n         windingRule = wrNonZero; blendMode = bmNormal)	
+fillPath	pixie/paths.html#fillPath,Image,SomePath,SomeColor,	paths: fillPath(image: Image; path: SomePath; color: SomeColor; transform: Vec2 | Mat3;\n         windingRule = wrNonZero; blendMode = bmNormal)	
 fillPath	pixie/paths.html#fillPath,Mask,SomePath	paths: fillPath(mask: Mask; path: SomePath; windingRule = wrNonZero)	
 fillPath	pixie/paths.html#fillPath,Mask,SomePath,	paths: fillPath(mask: Mask; path: SomePath; transform: Vec2 | Mat3;\n         windingRule = wrNonZero)	
 fillPath	pixie/paths.html#fillPath,Image,SomePath,Paint	paths: fillPath(image: Image; path: SomePath; paint: Paint; windingRule = wrNonZero)	
-strokePath	pixie/paths.html#strokePath,Image,SomePath,ColorRGBX,float	paths: strokePath(image: Image; path: SomePath; color: ColorRGBX; strokeWidth = 1.0;\n           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)	
-strokePath	pixie/paths.html#strokePath,Image,SomePath,ColorRGBX,,float	paths: strokePath(image: Image; path: SomePath; color: ColorRGBX;\n           transform: Vec2 | Mat3; strokeWidth = 1.0; lineCap = lcButt;\n           lineJoin = ljMiter; blendMode = bmNormal)	
+strokePath	pixie/paths.html#strokePath,Image,SomePath,SomeColor,float	paths: strokePath(image: Image; path: SomePath; color: SomeColor; strokeWidth = 1.0;\n           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)	
+strokePath	pixie/paths.html#strokePath,Image,SomePath,SomeColor,,float	paths: strokePath(image: Image; path: SomePath; color: SomeColor;\n           transform: Vec2 | Mat3; strokeWidth = 1.0; lineCap = lcButt;\n           lineJoin = ljMiter; blendMode = bmNormal)	
 strokePath	pixie/paths.html#strokePath,Mask,SomePath,float	paths: strokePath(mask: Mask; path: SomePath; strokeWidth = 1.0; lineCap = lcButt;\n           lineJoin = ljMiter)	
 strokePath	pixie/paths.html#strokePath,Mask,SomePath,,float	paths: strokePath(mask: Mask; path: SomePath; transform: Vec2 | Mat3;\n           strokeWidth = 1.0; lineCap = lcButt; lineJoin = ljMiter)	
diff --git a/docs/theindex.html b/docs/theindex.html
index fa312be..edfbe23 100644
--- a/docs/theindex.html
+++ b/docs/theindex.html
@@ -63,7 +63,7 @@ function main() {
 <div class="document" id="documentId">
   <div class="container">
     <h1 class="title">Index</h1>
-    Modules: <a href="pixie.html">pixie</a>, <a href="pixie/blends.html">pixie/blends</a>, <a href="pixie/common.html">pixie/common</a>, <a href="pixie/fileformats/bmp.html">pixie/fileformats/bmp</a>, <a href="pixie/fileformats/jpg.html">pixie/fileformats/jpg</a>, <a href="pixie/fileformats/png.html">pixie/fileformats/png</a>, <a href="pixie/fileformats/svg.html">pixie/fileformats/svg</a>, <a href="pixie/images.html">pixie/images</a>, <a href="pixie/internal.html">pixie/internal</a>, <a href="pixie/masks.html">pixie/masks</a>, <a href="pixie/paints.html">pixie/paints</a>, <a href="pixie/paths.html">pixie/paths</a>.<br/><p /><h2>API symbols</h2>
+    Modules: <a href="pixie.html">pixie</a>, <a href="pixie/blends.html">pixie/blends</a>, <a href="pixie/common.html">pixie/common</a>, <a href="pixie/fileformats/bmp.html">pixie/fileformats/bmp</a>, <a href="pixie/fileformats/gif.html">pixie/fileformats/gif</a>, <a href="pixie/fileformats/jpg.html">pixie/fileformats/jpg</a>, <a href="pixie/fileformats/png.html">pixie/fileformats/png</a>, <a href="pixie/fileformats/svg.html">pixie/fileformats/svg</a>, <a href="pixie/images.html">pixie/images</a>, <a href="pixie/internal.html">pixie/internal</a>, <a href="pixie/masks.html">pixie/masks</a>, <a href="pixie/paints.html">pixie/paints</a>, <a href="pixie/paths.html">pixie/paths</a>.<br/><p /><h2>API symbols</h2>
 <dl><dt><a name="%60%24%60" href="#%60%24%60"><span>`$`:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="images: `$`(image: Image): string" href="pixie/images.html#%24%2CImage">images: `$`(image: Image): string</a></li>
@@ -74,7 +74,7 @@ function main() {
           </ul></dd>
 <dt><a name="%60%5B%5D%3D%60" href="#%60%5B%5D%3D%60"><span>`[]=`:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: `[]=`(image: Image; x, y: int; rgba: ColorRGBX)" href="pixie/images.html#%5B%5D%3D%2CImage%2Cint%2Cint%2CColorRGBX">images: `[]=`(image: Image; x, y: int; rgba: ColorRGBX)</a></li>
+          data-doc-search-tag="images: `[]=`(image: Image; x, y: int; color: SomeColor)" href="pixie/images.html#%5B%5D%3D%2CImage%2Cint%2Cint%2CSomeColor">images: `[]=`(image: Image; x, y: int; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="masks: `[]=`(mask: Mask; x, y: int; value: uint8)" href="pixie/masks.html#%5B%5D%3D%2CMask%2Cint%2Cint%2Cuint8">masks: `[]=`(mask: Mask; x, y: int; value: uint8)</a></li>
           </ul></dd>
@@ -102,6 +102,14 @@ function main() {
           <li><a class="reference external"
           data-doc-search-tag="paths: arcTo(path: var Path; ctrl1, ctrl2: Vec2; radius: float32)" href="pixie/paths.html#arcTo%2CPath%2CVec2%2CVec2%2Cfloat32">paths: arcTo(path: var Path; ctrl1, ctrl2: Vec2; radius: float32)</a></li>
           </ul></dd>
+<dt><a name="autoPremultipliedAlpha" href="#autoPremultipliedAlpha"><span>autoPremultipliedAlpha:</span></a></dt><dd><ul class="simple">
+<li><a class="reference external"
+          data-doc-search-tag="pixie: autoPremultipliedAlpha(c: ColorRGBA): ColorRGBX" href="pixie.html#autoPremultipliedAlpha.c%2CColorRGBA">pixie: autoPremultipliedAlpha(c: ColorRGBA): ColorRGBX</a></li>
+          </ul></dd>
+<dt><a name="autoStraightAlpha" href="#autoStraightAlpha"><span>autoStraightAlpha:</span></a></dt><dd><ul class="simple">
+<li><a class="reference external"
+          data-doc-search-tag="pixie: autoStraightAlpha(c: ColorRGBX): ColorRGBA" href="pixie.html#autoStraightAlpha.c%2CColorRGBX">pixie: autoStraightAlpha(c: ColorRGBX): ColorRGBA</a></li>
+          </ul></dd>
 <dt><a name="bezierCurveTo" href="#bezierCurveTo"><span>bezierCurveTo:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="paths: bezierCurveTo(path: var Path; x1, y1, x2, y2, x3, y3: float32)" href="pixie/paths.html#bezierCurveTo%2CPath%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32">paths: bezierCurveTo(path: var Path; x1, y1, x2, y2, x3, y3: float32)</a></li>
@@ -134,7 +142,7 @@ function main() {
           </ul></dd>
 <dt><a name="blur" href="#blur"><span>blur:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: blur(image: Image; radius: float32; outOfBounds = ColorRGBX())" href="pixie/images.html#blur%2CImage%2Cfloat32">images: blur(image: Image; radius: float32; outOfBounds = ColorRGBX())</a></li>
+          data-doc-search-tag="images: blur(image: Image; radius: float32; outOfBounds: SomeColor = ColorRGBX())" href="pixie/images.html#blur%2CImage%2Cfloat32%2CSomeColor">images: blur(image: Image; radius: float32; outOfBounds: SomeColor = ColorRGBX())</a></li>
           <li><a class="reference external"
           data-doc-search-tag="masks: blur(mask: Mask; radius: float32; outOfBounds: uint8 = 0)" href="pixie/masks.html#blur%2CMask%2Cfloat32%2Cuint8">masks: blur(mask: Mask; radius: float32; outOfBounds: uint8 = 0)</a></li>
           </ul></dd>
@@ -268,6 +276,10 @@ function main() {
           <li><a class="reference external"
           data-doc-search-tag="bmp: decodeBmp(data: string): Image" href="pixie/fileformats/bmp.html#decodeBmp%2Cstring">bmp: decodeBmp(data: string): Image</a></li>
           </ul></dd>
+<dt><a name="decodeGif" href="#decodeGif"><span>decodeGif:</span></a></dt><dd><ul class="simple">
+<li><a class="reference external"
+          data-doc-search-tag="gif: decodeGif(data: string): Image" href="pixie/fileformats/gif.html#decodeGif%2Cstring">gif: decodeGif(data: string): Image</a></li>
+          </ul></dd>
 <dt><a name="decodeImage" href="#decodeImage"><span>decodeImage:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="pixie: decodeImage(data: string | seq[uint8]): Image" href="pixie.html#decodeImage">pixie: decodeImage(data: string | seq[uint8]): Image</a></li>
@@ -350,6 +362,10 @@ function main() {
 <li><a class="reference external"
           data-doc-search-tag="FileFormat.ffBmp" href="pixie.html#ffBmp">FileFormat.ffBmp</a></li>
           </ul></dd>
+<dt><a name="ffGif" href="#ffGif"><span>ffGif:</span></a></dt><dd><ul class="simple">
+<li><a class="reference external"
+          data-doc-search-tag="FileFormat.ffGif" href="pixie.html#ffGif">FileFormat.ffGif</a></li>
+          </ul></dd>
 <dt><a name="ffJpg" href="#ffJpg"><span>ffJpg:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="FileFormat.ffJpg" href="pixie.html#ffJpg">FileFormat.ffJpg</a></li>
@@ -364,7 +380,7 @@ function main() {
           </ul></dd>
 <dt><a name="fill" href="#fill"><span>fill:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: fill(image: Image; rgba: ColorRGBX)" href="pixie/images.html#fill%2CImage%2CColorRGBX">images: fill(image: Image; rgba: ColorRGBX)</a></li>
+          data-doc-search-tag="images: fill(image: Image; color: SomeColor)" href="pixie/images.html#fill%2CImage%2CSomeColor">images: fill(image: Image; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="masks: fill(mask: Mask; value: uint8)" href="pixie/masks.html#fill%2CMask%2Cuint8">masks: fill(mask: Mask; value: uint8)</a></li>
           </ul></dd>
@@ -376,14 +392,14 @@ function main() {
           </ul></dd>
 <dt><a name="fillCircle" href="#fillCircle"><span>fillCircle:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA)" href="pixie.html#fillCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA">pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA)</a></li>
+          data-doc-search-tag="pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: SomeColor)" href="pixie.html#fillCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor">pixie: fillCircle(image: Image; center: Vec2; radius: float32; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: fillCircle(mask: Mask; center: Vec2; radius: float32)" href="pixie.html#fillCircle%2CMask%2CVec2%2Cfloat32">pixie: fillCircle(mask: Mask; center: Vec2; radius: float32)</a></li>
           </ul></dd>
 <dt><a name="fillEllipse" href="#fillEllipse"><span>fillEllipse:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
-            blendMode = bmNormal)" href="pixie.html#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA">pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
+          data-doc-search-tag="pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
+            blendMode = bmNormal)" href="pixie.html#fillEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor">pixie: fillEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
             blendMode = bmNormal)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)" href="pixie.html#fillEllipse%2CMask%2CVec2%2Cfloat32%2Cfloat32">pixie: fillEllipse(mask: Mask; center: Vec2; rx, ry: float32)</a></li>
@@ -394,15 +410,15 @@ function main() {
           </ul></dd>
 <dt><a name="fillPath" href="#fillPath"><span>fillPath:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="paths: fillPath(image: Image; path: SomePath; color: ColorRGBX;
-         windingRule = wrNonZero; blendMode = bmNormal)" href="pixie/paths.html#fillPath%2CImage%2CSomePath%2CColorRGBX">paths: fillPath(image: Image; path: SomePath; color: ColorRGBX;
-         windingRule = wrNonZero; blendMode = bmNormal)</a></li>
-          <li><a class="reference external"
-          data-doc-search-tag="paths: fillPath(image: Image; path: SomePath; color: ColorRGBX; transform: Vec2 | Mat3;
-         windingRule = wrNonZero; blendMode = bmNormal)" href="pixie/paths.html#fillPath%2CImage%2CSomePath%2CColorRGBX%2C">paths: fillPath(image: Image; path: SomePath; color: ColorRGBX; transform: Vec2 | Mat3;
-         windingRule = wrNonZero; blendMode = bmNormal)</a></li>
-          <li><a class="reference external"
           data-doc-search-tag="paths: fillPath(image: Image; path: SomePath; paint: Paint; windingRule = wrNonZero)" href="pixie/paths.html#fillPath%2CImage%2CSomePath%2CPaint">paths: fillPath(image: Image; path: SomePath; paint: Paint; windingRule = wrNonZero)</a></li>
+          <li><a class="reference external"
+          data-doc-search-tag="paths: fillPath(image: Image; path: SomePath; color: SomeColor;
+         windingRule = wrNonZero; blendMode = bmNormal)" href="pixie/paths.html#fillPath%2CImage%2CSomePath%2CSomeColor">paths: fillPath(image: Image; path: SomePath; color: SomeColor;
+         windingRule = wrNonZero; blendMode = bmNormal)</a></li>
+          <li><a class="reference external"
+          data-doc-search-tag="paths: fillPath(image: Image; path: SomePath; color: SomeColor; transform: Vec2 | Mat3;
+         windingRule = wrNonZero; blendMode = bmNormal)" href="pixie/paths.html#fillPath%2CImage%2CSomePath%2CSomeColor%2C">paths: fillPath(image: Image; path: SomePath; color: SomeColor; transform: Vec2 | Mat3;
+         windingRule = wrNonZero; blendMode = bmNormal)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="paths: fillPath(mask: Mask; path: SomePath; windingRule = wrNonZero)" href="pixie/paths.html#fillPath%2CMask%2CSomePath">paths: fillPath(mask: Mask; path: SomePath; windingRule = wrNonZero)</a></li>
           <li><a class="reference external"
@@ -412,7 +428,7 @@ function main() {
           </ul></dd>
 <dt><a name="fillPolygon" href="#fillPolygon"><span>fillPolygon:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: ColorRGBA)" href="pixie.html#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA">pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: ColorRGBA)</a></li>
+          data-doc-search-tag="pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: SomeColor)" href="pixie.html#fillPolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor">pixie: fillPolygon(image: Image; pos: Vec2; size: float32; sides: int; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: fillPolygon(mask: Mask; pos: Vec2; size: float32; sides: int)" href="pixie.html#fillPolygon%2CMask%2CVec2%2Cfloat32%2Cint">pixie: fillPolygon(mask: Mask; pos: Vec2; size: float32; sides: int)</a></li>
           </ul></dd>
@@ -422,17 +438,17 @@ function main() {
           </ul></dd>
 <dt><a name="fillRect" href="#fillRect"><span>fillRect:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: fillRect(image: Image; rect: Rect; color: ColorRGBA)" href="pixie.html#fillRect%2CImage%2CRect%2CColorRGBA">pixie: fillRect(image: Image; rect: Rect; color: ColorRGBA)</a></li>
+          data-doc-search-tag="pixie: fillRect(image: Image; rect: Rect; color: SomeColor)" href="pixie.html#fillRect%2CImage%2CRect%2CSomeColor">pixie: fillRect(image: Image; rect: Rect; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: fillRect(mask: Mask; rect: Rect)" href="pixie.html#fillRect%2CMask%2CRect">pixie: fillRect(mask: Mask; rect: Rect)</a></li>
           </ul></dd>
 <dt><a name="fillRoundedRect" href="#fillRoundedRect"><span>fillRoundedRect:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA)" href="pixie.html#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA">pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA)</a></li>
-          <li><a class="reference external"
           data-doc-search-tag="pixie: fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                color: ColorRGBA)" href="pixie.html#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA">pixie: fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                color: ColorRGBA)</a></li>
+                color: SomeColor)" href="pixie.html#fillRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor">pixie: fillRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
+                color: SomeColor)</a></li>
+          <li><a class="reference external"
+          data-doc-search-tag="pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor)" href="pixie.html#fillRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor">pixie: fillRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: fillRoundedRect(mask: Mask; rect: Rect; radius: float32)" href="pixie.html#fillRoundedRect%2CMask%2CRect%2Cfloat32">pixie: fillRoundedRect(mask: Mask; rect: Rect; radius: float32)</a></li>
           <li><a class="reference external"
@@ -440,7 +456,7 @@ function main() {
           </ul></dd>
 <dt><a name="fillUnsafe" href="#fillUnsafe"><span>fillUnsafe:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: fillUnsafe(data: var seq[ColorRGBX]; rgba: ColorRGBX; start, len: int)" href="pixie/images.html#fillUnsafe%2Cseq%5BColorRGBX%5D%2CColorRGBX%2Cint%2Cint">images: fillUnsafe(data: var seq[ColorRGBX]; rgba: ColorRGBX; start, len: int)</a></li>
+          data-doc-search-tag="images: fillUnsafe(data: var seq[ColorRGBX]; color: SomeColor; start, len: int)" href="pixie/images.html#fillUnsafe%2Cseq%5BColorRGBX%5D%2CSomeColor%2Cint%2Cint">images: fillUnsafe(data: var seq[ColorRGBX]; color: SomeColor; start, len: int)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="masks: fillUnsafe(data: var seq[uint8]; value: uint8; start, len: int)" href="pixie/masks.html#fillUnsafe%2Cseq%5Buint8%5D%2Cuint8%2Cint%2Cint">masks: fillUnsafe(data: var seq[uint8]; value: uint8; start, len: int)</a></li>
           </ul></dd>
@@ -476,6 +492,10 @@ function main() {
 <li><a class="reference external"
           data-doc-search-tag="masks: getValueUnsafe(mask: Mask; x, y: int): uint8" href="pixie/masks.html#getValueUnsafe%2CMask%2Cint%2Cint">masks: getValueUnsafe(mask: Mask; x, y: int): uint8</a></li>
           </ul></dd>
+<dt><a name="gifSignatures" href="#gifSignatures"><span>gifSignatures:</span></a></dt><dd><ul class="simple">
+<li><a class="reference external"
+          data-doc-search-tag="gif: gifSignatures" href="pixie/fileformats/gif.html#gifSignatures">gif: gifSignatures</a></li>
+          </ul></dd>
 <dt><a name="hasSimdBlender" href="#hasSimdBlender"><span>hasSimdBlender:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="blends: hasSimdBlender(blendMode: BlendMode): bool" href="pixie/blends.html#hasSimdBlender%2CBlendMode">blends: hasSimdBlender(blendMode: BlendMode): bool</a></li>
@@ -758,7 +778,7 @@ function main() {
           </ul></dd>
 <dt><a name="setRgbaUnsafe" href="#setRgbaUnsafe"><span>setRgbaUnsafe:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: setRgbaUnsafe(image: Image; x, y: int; rgba: ColorRGBX)" href="pixie/images.html#setRgbaUnsafe%2CImage%2Cint%2Cint%2CColorRGBX">images: setRgbaUnsafe(image: Image; x, y: int; rgba: ColorRGBX)</a></li>
+          data-doc-search-tag="images: setRgbaUnsafe(image: Image; x, y: int; color: SomeColor)" href="pixie/images.html#setRgbaUnsafe%2CImage%2Cint%2Cint%2CSomeColor">images: setRgbaUnsafe(image: Image; x, y: int; color: SomeColor)</a></li>
           </ul></dd>
 <dt><a name="setValueUnsafe" href="#setValueUnsafe"><span>setValueUnsafe:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
@@ -766,7 +786,7 @@ function main() {
           </ul></dd>
 <dt><a name="shadow" href="#shadow"><span>shadow:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBX): Image" href="pixie/images.html#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBX">images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: ColorRGBX): Image</a></li>
+          data-doc-search-tag="images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: SomeColor): Image" href="pixie/images.html#shadow%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor">images: shadow(image: Image; offset: Vec2; spread, blur: float32; color: SomeColor): Image</a></li>
           </ul></dd>
 <dt><a name="shift" href="#shift"><span>shift:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
@@ -782,30 +802,30 @@ function main() {
           </ul></dd>
 <dt><a name="strokeCircle" href="#strokeCircle"><span>strokeCircle:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA;
-             strokeWidth = 1.0)" href="pixie.html#strokeCircle%2CImage%2CVec2%2Cfloat32%2CColorRGBA%2Cfloat">pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: ColorRGBA;
+          data-doc-search-tag="pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: SomeColor;
+             strokeWidth = 1.0)" href="pixie.html#strokeCircle%2CImage%2CVec2%2Cfloat32%2CSomeColor%2Cfloat">pixie: strokeCircle(image: Image; center: Vec2; radius: float32; color: SomeColor;
              strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokeCircle(mask: Mask; center: Vec2; radius: float32; strokeWidth = 1.0)" href="pixie.html#strokeCircle%2CMask%2CVec2%2Cfloat32%2Cfloat">pixie: strokeCircle(mask: Mask; center: Vec2; radius: float32; strokeWidth = 1.0)</a></li>
           </ul></dd>
 <dt><a name="strokeEllipse" href="#strokeEllipse"><span>strokeEllipse:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
-              strokeWidth = 1.0)" href="pixie.html#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat">pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: ColorRGBA;
+          data-doc-search-tag="pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
+              strokeWidth = 1.0)" href="pixie.html#strokeEllipse%2CImage%2CVec2%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat">pixie: strokeEllipse(image: Image; center: Vec2; rx, ry: float32; color: SomeColor;
               strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokeEllipse(mask: Mask; center: Vec2; rx, ry: float32; strokeWidth = 1.0)" href="pixie.html#strokeEllipse%2CMask%2CVec2%2Cfloat32%2Cfloat32%2Cfloat">pixie: strokeEllipse(mask: Mask; center: Vec2; rx, ry: float32; strokeWidth = 1.0)</a></li>
           </ul></dd>
 <dt><a name="strokePath" href="#strokePath"><span>strokePath:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="paths: strokePath(image: Image; path: SomePath; color: ColorRGBX;
+          data-doc-search-tag="paths: strokePath(image: Image; path: SomePath; color: SomeColor;
            transform: Vec2 | Mat3; strokeWidth = 1.0; lineCap = lcButt;
-           lineJoin = ljMiter; blendMode = bmNormal)" href="pixie/paths.html#strokePath%2CImage%2CSomePath%2CColorRGBX%2C%2Cfloat">paths: strokePath(image: Image; path: SomePath; color: ColorRGBX;
+           lineJoin = ljMiter; blendMode = bmNormal)" href="pixie/paths.html#strokePath%2CImage%2CSomePath%2CSomeColor%2C%2Cfloat">paths: strokePath(image: Image; path: SomePath; color: SomeColor;
            transform: Vec2 | Mat3; strokeWidth = 1.0; lineCap = lcButt;
            lineJoin = ljMiter; blendMode = bmNormal)</a></li>
           <li><a class="reference external"
-          data-doc-search-tag="paths: strokePath(image: Image; path: SomePath; color: ColorRGBX; strokeWidth = 1.0;
-           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)" href="pixie/paths.html#strokePath%2CImage%2CSomePath%2CColorRGBX%2Cfloat">paths: strokePath(image: Image; path: SomePath; color: ColorRGBX; strokeWidth = 1.0;
+          data-doc-search-tag="paths: strokePath(image: Image; path: SomePath; color: SomeColor; strokeWidth = 1.0;
+           lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)" href="pixie/paths.html#strokePath%2CImage%2CSomePath%2CSomeColor%2Cfloat">paths: strokePath(image: Image; path: SomePath; color: SomeColor; strokeWidth = 1.0;
            lineCap = lcButt; lineJoin = ljMiter; blendMode = bmNormal)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="paths: strokePath(mask: Mask; path: SomePath; transform: Vec2 | Mat3;
@@ -819,8 +839,8 @@ function main() {
 <dt><a name="strokePolygon" href="#strokePolygon"><span>strokePolygon:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
           data-doc-search-tag="pixie: strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;
-              color: ColorRGBA; strokeWidth = 1.0)" href="pixie.html#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CColorRGBA%2Cfloat">pixie: strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;
-              color: ColorRGBA; strokeWidth = 1.0)</a></li>
+              color: SomeColor; strokeWidth = 1.0)" href="pixie.html#strokePolygon%2CImage%2CVec2%2Cfloat32%2Cint%2CSomeColor%2Cfloat">pixie: strokePolygon(image: Image; pos: Vec2; size: float32; sides: int;
+              color: SomeColor; strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokePolygon(mask: Mask; pos: Vec2; size: float32; sides: int;
               strokeWidth = 1.0)" href="pixie.html#strokePolygon%2CMask%2CVec2%2Cfloat32%2Cint%2Cfloat">pixie: strokePolygon(mask: Mask; pos: Vec2; size: float32; sides: int;
@@ -828,19 +848,19 @@ function main() {
           </ul></dd>
 <dt><a name="strokeRect" href="#strokeRect"><span>strokeRect:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: strokeRect(image: Image; rect: Rect; color: ColorRGBA; strokeWidth = 1.0)" href="pixie.html#strokeRect%2CImage%2CRect%2CColorRGBA%2Cfloat">pixie: strokeRect(image: Image; rect: Rect; color: ColorRGBA; strokeWidth = 1.0)</a></li>
+          data-doc-search-tag="pixie: strokeRect(image: Image; rect: Rect; color: SomeColor; strokeWidth = 1.0)" href="pixie.html#strokeRect%2CImage%2CRect%2CSomeColor%2Cfloat">pixie: strokeRect(image: Image; rect: Rect; color: SomeColor; strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokeRect(mask: Mask; rect: Rect; strokeWidth = 1.0)" href="pixie.html#strokeRect%2CMask%2CRect%2Cfloat">pixie: strokeRect(mask: Mask; rect: Rect; strokeWidth = 1.0)</a></li>
           </ul></dd>
 <dt><a name="strokeRoundedRect" href="#strokeRoundedRect"><span>strokeRoundedRect:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA;
-                  strokeWidth = 1.0)" href="pixie.html#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CColorRGBA%2Cfloat">pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: ColorRGBA;
-                  strokeWidth = 1.0)</a></li>
-          <li><a class="reference external"
           data-doc-search-tag="pixie: strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                  color: ColorRGBA; strokeWidth = 1.0)" href="pixie.html#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CColorRGBA%2Cfloat">pixie: strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
-                  color: ColorRGBA; strokeWidth = 1.0)</a></li>
+                  color: SomeColor; strokeWidth = 1.0)" href="pixie.html#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2Cfloat32%2Cfloat32%2Cfloat32%2CSomeColor%2Cfloat">pixie: strokeRoundedRect(image: Image; rect: Rect; nw, ne, se, sw: float32;
+                  color: SomeColor; strokeWidth = 1.0)</a></li>
+          <li><a class="reference external"
+          data-doc-search-tag="pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor;
+                  strokeWidth = 1.0)" href="pixie.html#strokeRoundedRect%2CImage%2CRect%2Cfloat32%2CSomeColor%2Cfloat">pixie: strokeRoundedRect(image: Image; rect: Rect; radius: float32; color: SomeColor;
+                  strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokeRoundedRect(mask: Mask; rect: Rect; radius: float32; strokeWidth = 1.0)" href="pixie.html#strokeRoundedRect%2CMask%2CRect%2Cfloat32%2Cfloat">pixie: strokeRoundedRect(mask: Mask; rect: Rect; radius: float32; strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
@@ -850,8 +870,8 @@ function main() {
           </ul></dd>
 <dt><a name="strokeSegment" href="#strokeSegment"><span>strokeSegment:</span></a></dt><dd><ul class="simple">
 <li><a class="reference external"
-          data-doc-search-tag="pixie: strokeSegment(image: Image; segment: Segment; color: ColorRGBA;
-              strokeWidth = 1.0)" href="pixie.html#strokeSegment%2CImage%2CSegment%2CColorRGBA%2Cfloat">pixie: strokeSegment(image: Image; segment: Segment; color: ColorRGBA;
+          data-doc-search-tag="pixie: strokeSegment(image: Image; segment: Segment; color: SomeColor;
+              strokeWidth = 1.0)" href="pixie.html#strokeSegment%2CImage%2CSegment%2CSomeColor%2Cfloat">pixie: strokeSegment(image: Image; segment: Segment; color: SomeColor;
               strokeWidth = 1.0)</a></li>
           <li><a class="reference external"
           data-doc-search-tag="pixie: strokeSegment(mask: Mask; segment: Segment; strokeWidth: float32)" href="pixie.html#strokeSegment%2CMask%2CSegment%2Cfloat32">pixie: strokeSegment(mask: Mask; segment: Segment; strokeWidth: float32)</a></li>
@@ -925,7 +945,7 @@ function main() {
       <div class="twelve-columns footer">
         <span class="nim-sprite"></span>
         <br/>
-        <small style="color: var(--hint);">Made with Nim. Generated: 2021-02-28 07:11:38 UTC</small>
+        <small style="color: var(--hint);">Made with Nim. Generated: 2021-03-12 03:47:40 UTC</small>
       </div>
     </div>
   </div>
diff --git a/pixie.nimble b/pixie.nimble
index da563f9..bb90d1a 100644
--- a/pixie.nimble
+++ b/pixie.nimble
@@ -1,4 +1,4 @@
-version     = "1.0.5"
+version     = "1.1.0"
 author      = "Andre von Houck and Ryan Oldenburg"
 description = "Full-featured 2d graphics library for Nim."
 license     = "MIT"
@@ -7,7 +7,7 @@ srcDir = "src"
 
 requires "nim >= 1.2.6"
 requires "vmath >= 0.4.0"
-requires "chroma >= 0.2.4"
+requires "chroma >= 0.2.5"
 requires "zippy >= 0.3.5"
 requires "flatty >= 0.1.3"
 requires "nimsimd >= 1.0.0"
diff --git a/src/pixie.nim b/src/pixie.nim
index c6cb329..6f13f34 100644
--- a/src/pixie.nim
+++ b/src/pixie.nim
@@ -63,7 +63,7 @@ proc writeFile*(image: Image, filePath: string) =
       raise newException(PixieError, "Unsupported image file extension")
   image.writeFile(filePath, fileformat)
 
-proc fillRect*(image: Image, rect: Rect, color: ColorRGBA) =
+proc fillRect*(image: Image, rect: Rect, color: SomeColor) =
   ## Fills a rectangle.
   var path: Path
   path.rect(rect)
@@ -76,7 +76,7 @@ proc fillRect*(mask: Mask, rect: Rect) =
   mask.fillPath(path)
 
 proc strokeRect*(
-  image: Image, rect: Rect, color: ColorRGBA, strokeWidth = 1.0
+  image: Image, rect: Rect, color: SomeColor, strokeWidth = 1.0
 ) =
   ## Strokes a rectangle.
   var path: Path
@@ -93,7 +93,7 @@ proc fillRoundedRect*(
   image: Image,
   rect: Rect,
   nw, ne, se, sw: float32,
-  color: ColorRGBA
+  color: SomeColor
 ) =
   ## Fills a rounded rectangle.
   var path: Path
@@ -104,7 +104,7 @@ proc fillRoundedRect*(
   image: Image,
   rect: Rect,
   radius: float32,
-  color: ColorRGBA
+  color: SomeColor
 ) =
   ## Fills a rounded rectangle.
   var path: Path
@@ -127,7 +127,7 @@ proc strokeRoundedRect*(
   image: Image,
   rect: Rect,
   nw, ne, se, sw: float32,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes a rounded rectangle.
@@ -139,7 +139,7 @@ proc strokeRoundedRect*(
   image: Image,
   rect: Rect,
   radius: float32,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes a rounded rectangle.
@@ -166,7 +166,7 @@ proc strokeRoundedRect*(
 proc strokeSegment*(
   image: Image,
   segment: Segment,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes a segment (draws a line from segment.at to segment.to).
@@ -186,7 +186,7 @@ proc fillEllipse*(
   image: Image,
   center: Vec2,
   rx, ry: float32,
-  color: ColorRGBA,
+  color: SomeColor,
   blendMode = bmNormal
 ) =
   ## Fills an ellipse.
@@ -208,7 +208,7 @@ proc strokeEllipse*(
   image: Image,
   center: Vec2,
   rx, ry: float32,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes an ellipse.
@@ -231,7 +231,7 @@ proc fillCircle*(
   image: Image,
   center: Vec2,
   radius: float32,
-  color: ColorRGBA
+  color: SomeColor
 ) =
   ## Fills a circle.
   var path: Path
@@ -252,7 +252,7 @@ proc strokeCircle*(
   image: Image,
   center: Vec2,
   radius: float32,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes a circle.
@@ -276,7 +276,7 @@ proc fillPolygon*(
   pos: Vec2,
   size: float32,
   sides: int,
-  color: ColorRGBA
+  color: SomeColor
 ) =
   ## Fills a polygon.
   var path: Path
@@ -294,7 +294,7 @@ proc strokePolygon*(
   pos: Vec2,
   size: float32,
   sides: int,
-  color: ColorRGBA,
+  color: SomeColor,
   strokeWidth = 1.0
 ) =
   ## Strokes a polygon.
diff --git a/src/pixie/images.nim b/src/pixie/images.nim
index c1e7f13..0de77ce 100644
--- a/src/pixie/images.nim
+++ b/src/pixie/images.nim
@@ -56,30 +56,32 @@ proc `[]`*(image: Image, x, y: int): ColorRGBX {.inline.} =
   if image.inside(x, y):
     return image.getRgbaUnsafe(x, y)
 
-proc setRgbaUnsafe*(image: Image, x, y: int, rgba: ColorRGBX) {.inline.} =
+proc setRgbaUnsafe*(image: Image, x, y: int, color: SomeColor) {.inline.} =
   ## Sets a color from (x, y) coordinates.
   ## * No bounds checking *
   ## Make sure that x, y are in bounds.
   ## Failure in the assumptions will case unsafe memory writes.
-  image.data[image.dataIndex(x, y)] = rgba
+  image.data[image.dataIndex(x, y)] = color.asRgbx()
 
-proc `[]=`*(image: Image, x, y: int, rgba: ColorRGBX) {.inline.} =
+proc `[]=`*(image: Image, x, y: int, color: SomeColor) {.inline.} =
   ## Sets a pixel at (x, y) or does nothing if outside of bounds.
   if image.inside(x, y):
-    image.setRgbaUnsafe(x, y, rgba)
+    image.setRgbaUnsafe(x, y, color.asRgbx())
 
-proc fillUnsafe*(data: var seq[ColorRGBX], rgba: ColorRGBX, start, len: int) =
+proc fillUnsafe*(data: var seq[ColorRGBX], color: SomeColor, start, len: int) =
   ## Fills the image data with the parameter color starting at index start and
   ## continuing for len indices.
 
+  let rgbx = color.asRgbx()
+
   # Use memset when every byte has the same value
-  if rgba.r == rgba.g and rgba.r == rgba.b and rgba.r == rgba.a:
-    nimSetMem(data[start].addr, rgba.r.cint, len * 4)
+  if rgbx.r == rgbx.g and rgbx.r == rgbx.b and rgbx.r == rgbx.a:
+    nimSetMem(data[start].addr, rgbx.r.cint, len * 4)
   else:
     var i = start
     when defined(amd64) and not defined(pixieNoSimd):
       # When supported, SIMD fill until we run out of room
-      let m = mm_set1_epi32(cast[int32](rgba))
+      let m = mm_set1_epi32(cast[int32](rgbx))
       for j in countup(i, start + len - 8, 8):
         mm_storeu_si128(data[j].addr, m)
         mm_storeu_si128(data[j + 4].addr, m)
@@ -88,18 +90,18 @@ proc fillUnsafe*(data: var seq[ColorRGBX], rgba: ColorRGBX, start, len: int) =
       when sizeof(int) == 8:
         # Fill 8 bytes at a time when possible
         let
-          u32 = cast[uint32](rgba)
+          u32 = cast[uint32](rgbx)
           u64 = cast[uint64]([u32, u32])
         for j in countup(i, start + len - 2, 2):
           cast[ptr uint64](data[j].addr)[] = u64
           i += 2
     # Fill whatever is left the slow way
     for j in i ..< start + len:
-      data[j] = rgba
+      data[j] = rgbx
 
-proc fill*(image: Image, rgba: ColorRGBX) {.inline.} =
+proc fill*(image: Image, color: SomeColor) {.inline.} =
   ## Fills the image with the parameter color.
-  fillUnsafe(image.data, rgba, 0, image.data.len)
+  fillUnsafe(image.data, color, 0, image.data.len)
 
 proc flipHorizontal*(image: Image) =
   ## Flips the image around the Y axis.
@@ -347,13 +349,17 @@ proc invert*(target: Image | Mask) =
     for j in i ..< target.data.len:
       target.data[j] = (255 - target.data[j]).uint8
 
-proc blur*(image: Image, radius: float32, outOfBounds = ColorRGBX()) =
+proc blur*(
+  image: Image, radius: float32, outOfBounds: SomeColor = ColorRGBX()
+) =
   ## Applies Gaussian blur to the image given a radius.
   let radius = round(radius).int
   if radius == 0:
     return
 
-  let kernel = gaussianKernel(radius)
+  let
+    kernel = gaussianKernel(radius)
+    outOfBounds = outOfBounds.asRgbx()
 
   proc `*`(sample: ColorRGBX, a: uint32): array[4, uint32] {.inline.} =
     [
@@ -794,7 +800,7 @@ proc shift*(target: Image | Mask, offset: Vec2) =
     target.draw(copy, offset, bmOverwrite) # Draw copy at offset
 
 proc shadow*(
-  image: Image, offset: Vec2, spread, blur: float32, color: ColorRGBX
+  image: Image, offset: Vec2, spread, blur: float32, color: SomeColor
 ): Image =
   ## Create a shadow of the image with the offset, spread and blur.
   let mask = image.newMask()
diff --git a/src/pixie/paths.nim b/src/pixie/paths.nim
index e6a4a75..b4cc235 100644
--- a/src/pixie/paths.nim
+++ b/src/pixie/paths.nim
@@ -1105,11 +1105,12 @@ template computeCoverages(
 proc fillShapes(
   image: Image,
   shapes: seq[seq[Vec2]],
-  color: ColorRGBX,
+  color: SomeColor,
   windingRule: WindingRule,
   blendMode: BlendMode
 ) =
   let
+    rgbx = color.asRgbx()
     partitions = partitionSegments(shapes, image.height)
     partitionHeight = image.height.uint32 div partitions.len.uint32
 
@@ -1128,7 +1129,7 @@ proc fillShapes(
       first32 = cast[M128i]([uint32.high, 0, 0, 0]) # First 32 bits
       oddMask = mm_set1_epi16(cast[int16](0xff00))
       div255 = mm_set1_epi16(cast[int16](0x8081))
-      vColor = mm_set1_epi32(cast[int32](color))
+      vColor = mm_set1_epi32(cast[int32](rgbx))
 
   var
     coverages = newSeq[uint8](image.width)
@@ -1160,7 +1161,7 @@ proc fillShapes(
           # If the coverages are not all zero
           if mm_movemask_epi8(mm_cmpeq_epi32(coverage, first32)) == 0xffff:
             # Coverages are all 255
-            if color.a == 255 and blendMode == bmNormal:
+            if rgbx.a == 255 and blendMode == bmNormal:
               mm_storeu_si128(image.data[index].addr, vColor)
             else:
               let backdrop = mm_loadu_si128(image.data[index].addr)
@@ -1203,12 +1204,12 @@ proc fillShapes(
 
       let coverage = coverages[x]
       if coverage != 0:
-        var source = color
+        var source = rgbx
         if coverage != 255:
-          source.r = ((color.r.uint32 * coverage) div 255).uint8
-          source.g = ((color.g.uint32 * coverage) div 255).uint8
-          source.b = ((color.b.uint32 * coverage) div 255).uint8
-          source.a = ((color.a.uint32 * coverage) div 255).uint8
+          source.r = ((source.r.uint32 * coverage) div 255).uint8
+          source.g = ((source.g.uint32 * coverage) div 255).uint8
+          source.b = ((source.b.uint32 * coverage) div 255).uint8
+          source.a = ((source.a.uint32 * coverage) div 255).uint8
 
         if source.a == 255 and blendMode == bmNormal:
           # Skip blending
@@ -1418,7 +1419,7 @@ proc parseSomePath(
 proc fillPath*(
   image: Image,
   path: SomePath,
-  color: ColorRGBX,
+  color: SomeColor,
   windingRule = wrNonZero,
   blendMode = bmNormal
 ) {.inline.} =
@@ -1428,7 +1429,7 @@ proc fillPath*(
 proc fillPath*(
   image: Image,
   path: SomePath,
-  color: ColorRGBX,
+  color: SomeColor,
   transform: Vec2 | Mat3,
   windingRule = wrNonZero,
   blendMode = bmNormal
@@ -1526,7 +1527,7 @@ proc fillPath*(
 proc strokePath*(
   image: Image,
   path: SomePath,
-  color: ColorRGBX,
+  color: SomeColor,
   strokeWidth = 1.0,
   lineCap = lcButt,
   lineJoin = ljMiter,
@@ -1541,7 +1542,7 @@ proc strokePath*(
 proc strokePath*(
   image: Image,
   path: SomePath,
-  color: ColorRGBX,
+  color: SomeColor,
   transform: Vec2 | Mat3,
   strokeWidth = 1.0,
   lineCap = lcButt,