Add docs for gradients

Signed-off-by: martinRenou <[email protected]>

Author: martinRenou

docs/source/images/linear_gradient.png

@@ -1,3 +1,5 @@
+.. _rough_canvas:
+
 Rough Canvas
 ============
 

docs/source/images/radial_gradient.png

@@ -28,6 +28,79 @@ You can also change the global transparency.
 
 .. image:: images/colored_rect.png
 
+Color Gradients
+---------------
+
+There are two canvas methods that allow you to create color gradients (either linear or radial) that you can use as a ``fill_style`` or ``stroke_style``.
+
+- ``create_linear_gradient(x0, y0, x1, y1, color_stops)``: Create a ``LinearGradient`` object given the start point ``(x0, y0)``, end point ``(x1, y1)``, and color stops.
+- ``create_radial_gradient(x0, y0, r0, x1, y1, r1, color_stops)``: Create a ``RadialGradient`` object given the start circle ``(x0, y0, r0)``, end circle ``(x1, y1, r1)``, and color stops.
+
+You need to provide the start point and end point of your gradient (those coordinates are global to the entire canvas, it's not per-shape).
+The color stops is a list of tuple ``(offset, color)``, ``offset`` being a number between 0 and 1, inclusive, representing the position of the
+color stop. 0 represents the start of the gradient and 1 represents the end.
+
+.. code:: Python
+
+    from ipycanvas import Canvas
+
+    canvas = Canvas(width=700, height=50)
+
+    gradient = canvas.create_linear_gradient(
+        0, 0, # Start position (x0, y0)
+        700, 0, # End position (x1, y1)
+        # List of color stops
+        [
+            (0, 'red'),
+            (1 / 6, 'orange'),
+            (2 / 6, 'yellow'),
+            (3 / 6, 'green'),
+            (4 / 6, 'blue'),
+            (5 / 6, '#4B0082'),
+            (1, 'violet')
+        ]
+    )
+
+    canvas.fill_style = gradient
+    canvas.fill_rect(0, 0, 700, 50)
+
+    canvas
+
+.. image:: images/linear_gradient.png
+
+.. code:: Python
+
+    from ipycanvas import Canvas
+
+    canvas = Canvas(width=570, height=200)
+
+    radial_gradient = canvas.create_radial_gradient(
+        238, 50, 10, # Start circle (x0, y0, r0)
+        238, 50, 300, # End circle (x1, y1, r1)
+        [
+            (0, '#8ED6FF'),
+            (1, '#004CB3'),
+        ]
+    )
+
+    canvas.fill_style = radial_gradient
+
+    canvas.fill_rect(0, 0, 570, 200)
+
+    canvas
+
+.. image:: images/radial_gradient.png
+
+Patterns
+--------
+
+
+
+RoughCanvas
+-----------
+
+ipycanvas provides a special ``Canvas`` class which will automatically give a hand-drawn style to your drawings: see the :ref:`rough_canvas` section.
+
 Shadows
 -------