diff --git a/docs/Gemfile b/docs/Gemfile
index b09f5d6d..608df321 100644
--- a/docs/Gemfile
+++ b/docs/Gemfile
@@ -9,6 +9,7 @@ source "https://rubygems.org"
 # This will help ensure the proper Jekyll version is running.
 
 gem "jekyll", "~> 4.3.2"
+gem "json"
 gem "just-the-docs"
 
 # If you want to use GitHub Pages, remove the "gem "jekyll"" above and
diff --git a/docs/ORX/compositor.markdown b/docs/ORX/compositor.markdown
index 21ae91e2..513599af 100644
--- a/docs/ORX/compositor.markdown
+++ b/docs/ORX/compositor.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C170_Compositor.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C170_Compositor.kt' instead.
 layout: default
 title: Compositor
 parent: ORX
-last_modified_at: 2023.12.26 16:00:58 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 170
 has_children: false
 ---
@@ -119,7 +119,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor000.kt) 
  
 This produces: 
  
@@ -168,7 +168,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor001.kt) 
  
 The output: 
  
@@ -216,7 +216,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor002.kt) 
  
 <video controls preload="none" loop poster="../media/compositor-003-thumb.jpg">
     <source src="../media/compositor-003.mp4" type="video/mp4"></source>
@@ -286,7 +286,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor003.kt) 
  
 ### Drop shadows
 
@@ -345,7 +345,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor004.kt) 
  
 ### Multiple effects per layer
 
@@ -416,7 +416,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C170_Compositor005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C170_Compositor005.kt) 
  
 ## Opacity
 
@@ -496,4 +496,4 @@ where `8` is the desired level.
 Values between 0 (the default) and 16 are typically used.
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C170_Compositor.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C170_Compositor.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/distanceFields.markdown b/docs/ORX/distanceFields.markdown
index d1f6302f..62e06ede 100644
--- a/docs/ORX/distanceFields.markdown
+++ b/docs/ORX/distanceFields.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C220_Distance_fields.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C220_Distance_fields.kt' instead.
 layout: default
 title: Distance fields
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 220
 has_children: false
 ---
@@ -51,7 +51,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C220_Distance_fields000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C220_Distance_fields000.kt) 
  
 ## Outer glow
 
@@ -83,7 +83,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C220_Distance_fields001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C220_Distance_fields001.kt) 
  
 ## Inner glow
 
@@ -116,7 +116,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C220_Distance_fields002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C220_Distance_fields002.kt) 
  
 ## Sampling distance 
  
@@ -171,6 +171,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C220_Distance_fields003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C220_Distance_fields003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C220_Distance_fields.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C220_Distance_fields.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/imageFilters.markdown b/docs/ORX/imageFilters.markdown
index e1a61364..66be301e 100644
--- a/docs/ORX/imageFilters.markdown
+++ b/docs/ORX/imageFilters.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C160_Filters.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C160_Filters.kt' instead.
 layout: default
 title: Image post-processing with filters
 parent: ORX
-last_modified_at: 2023.12.26 15:40:22 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 160
 has_children: false
 ---
@@ -67,7 +67,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters000.kt) 
  
 #### ApproximateGaussianBlur 
  
@@ -92,7 +92,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters001.kt) 
  
 #### GaussianBloom 
  
@@ -118,7 +118,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters002.kt) 
  
 #### HashBlur 
  
@@ -143,7 +143,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters003.kt) 
  
 #### FrameBlur 
  
@@ -176,7 +176,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters004.kt) 
  
 #### ZoomBlur 
  
@@ -202,7 +202,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters005.kt) 
  
 ## Color filters
 
@@ -229,7 +229,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters006.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters006.kt) 
  
 #### ColorCorrection 
  
@@ -256,7 +256,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters007.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters007.kt) 
  
 #### Sepia 
  
@@ -281,7 +281,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters008.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters008.kt) 
  
 #### LumaOpacity 
  
@@ -312,7 +312,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters009.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters009.kt) 
  
 ## Edge-detection filters
 
@@ -340,7 +340,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters010.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters010.kt) 
  
 #### Contour 
  
@@ -368,7 +368,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters011.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters011.kt) 
  
 #### EdgesWork 
  
@@ -393,7 +393,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters012.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters012.kt) 
  
 ## Distortion filters
 
@@ -423,7 +423,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters013.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters013.kt) 
  
 #### StackRepeat 
  
@@ -450,7 +450,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters014.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters014.kt) 
  
 #### HorizontalWave 
  
@@ -480,7 +480,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters015.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters015.kt) 
  
 #### VerticalWave 
  
@@ -510,7 +510,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters016.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters016.kt) 
  
 #### Perturb 
  
@@ -538,7 +538,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters017.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters017.kt) 
  
 #### Tiles 
  
@@ -565,7 +565,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters018.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters018.kt) 
  
 #### Fisheye 
  
@@ -591,7 +591,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters019.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters019.kt) 
  
 #### DisplaceBlend 
  
@@ -632,7 +632,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters020.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters020.kt) 
  
 #### StretchWaves 
  
@@ -666,7 +666,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters021.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters021.kt) 
  
 #### PerspectivePlane 
  
@@ -701,7 +701,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters022.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters022.kt) 
  
 ## Dithering filters
 
@@ -729,7 +729,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters023.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters023.kt) 
  
 #### CMYKHalftone 
  
@@ -758,7 +758,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters024.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters024.kt) 
  
 #### Crosshatch 
  
@@ -790,7 +790,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters025.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters025.kt) 
  
 ## Shadow filters
 
@@ -829,7 +829,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters026.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters026.kt) 
  
 ## Pattern filters
 
@@ -859,6 +859,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C160_Filters027.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C160_Filters027.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C160_Filters.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C160_Filters.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/imageFit.markdown b/docs/ORX/imageFit.markdown
index 3c53ef2b..7e3913fb 100644
--- a/docs/ORX/imageFit.markdown
+++ b/docs/ORX/imageFit.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C200_Image_fit.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C200_Image_fit.kt' instead.
 layout: default
 title: Image fit
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 200
 has_children: false
 ---
@@ -46,7 +46,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C200_Image_fit000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C200_Image_fit000.kt) 
  
 Additionally the placement of the image in the rectangle can be adjusted 
  
@@ -71,7 +71,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C200_Image_fit001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C200_Image_fit001.kt) 
  
 ## Cover mode 
  
@@ -100,7 +100,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C200_Image_fit002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C200_Image_fit002.kt) 
  
 <video controls preload="none" loop poster="../media/image-fit-102-thumb.jpg">
     <source src="../media/image-fit-102.mp4" type="video/mp4"></source>
@@ -126,6 +126,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C200_Image_fit003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C200_Image_fit003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C200_Image_fit.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C200_Image_fit.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/index.markdown b/docs/ORX/index.markdown
index b39de483..4d911b51 100644
--- a/docs/ORX/index.markdown
+++ b/docs/ORX/index.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/index.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/index.kt' instead.
 layout: default
 title: ORX
 parent: ~
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1100
 has_children: true
 ---
@@ -28,4 +28,4 @@ the repositories are already set up and one only has to
 3. Save
 4. Reimport Gradle projects: if using Idea choose 🔄 _Reimport All Gradle Projects_ from the Gradle panel. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/kinect.markdown b/docs/ORX/kinect.markdown
index d555bfca..4ddb05d3 100644
--- a/docs/ORX/kinect.markdown
+++ b/docs/ORX/kinect.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C120_Kinect.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C120_Kinect.kt' instead.
 layout: default
 title: Kinect
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 120
 has_children: false
 ---
@@ -123,4 +123,4 @@ library. Even though the access to freenect is abstracted, it is still possible
 in the native API.
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C120_Kinect.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C120_Kinect.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/liveCoding.markdown b/docs/ORX/liveCoding.markdown
index 8663cf6b..1c702c36 100644
--- a/docs/ORX/liveCoding.markdown
+++ b/docs/ORX/liveCoding.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C130_Live_coding.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C130_Live_coding.kt' instead.
 layout: default
 title: Live coding
 parent: ORX
-last_modified_at: 2023.12.26 15:35:10 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 130
 has_children: false
 ---
@@ -122,4 +122,4 @@ import org.openrndr.draw.*
 }         
 ```          
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C130_Live_coding.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C130_Live_coding.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/midiControllers.markdown b/docs/ORX/midiControllers.markdown
index 388278bb..e70459d1 100644
--- a/docs/ORX/midiControllers.markdown
+++ b/docs/ORX/midiControllers.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C140_Midi_controllers.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C140_Midi_controllers.kt' instead.
 layout: default
 title: MIDI controllers
 parent: ORX
-last_modified_at: 2024.01.11 17:46:11 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 140
 has_children: false
 ---
@@ -180,4 +180,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C140_Midi_controllers.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C140_Midi_controllers.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/noise.markdown b/docs/ORX/noise.markdown
index ad1415e2..e753f10f 100644
--- a/docs/ORX/noise.markdown
+++ b/docs/ORX/noise.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C110_Noise.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C110_Noise.kt' instead.
 layout: default
 title: Noise
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -109,7 +109,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise000.kt) 
  
 ## Perlin noise 
  
@@ -133,7 +133,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise001.kt) 
  
 ## Value noise 
  
@@ -157,7 +157,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise002.kt) 
  
 ## Simplex noise 
  
@@ -181,7 +181,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise003.kt) 
  
 ## Fractal/FBM noise 
  
@@ -213,7 +213,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise004.kt) 
  
 ## Noise gradients
 
@@ -247,7 +247,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise005.kt) 
  
 Gradients can also be calculated for the fbm, rigid and billow versions 
 of the noise functions. However, 
@@ -282,6 +282,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C110_Noise006.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C110_Noise006.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C110_Noise.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C110_Noise.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/osc.markdown b/docs/ORX/osc.markdown
index 33b206a5..dc5deb5d 100644
--- a/docs/ORX/osc.markdown
+++ b/docs/ORX/osc.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C150_OSC.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C150_OSC.kt' instead.
 layout: default
 title: OSC
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 150
 has_children: false
 ---
@@ -70,4 +70,4 @@ values like this:
 val osc = OSC(InetAddress.getByName("192.168.0.105"), portIn = 10000, portOut = 12000)
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C150_OSC.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C150_OSC.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/poissonFills.markdown b/docs/ORX/poissonFills.markdown
index 43f259d5..0273f766 100644
--- a/docs/ORX/poissonFills.markdown
+++ b/docs/ORX/poissonFills.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C210_Poisson_fills.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C210_Poisson_fills.kt' instead.
 layout: default
 title: Poisson fills
 parent: ORX
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 210
 has_children: false
 ---
@@ -70,7 +70,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C210_Poisson_fills000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C210_Poisson_fills000.kt) 
  
 <video controls preload="none" loop poster="../media/poisson-fills-002-thumb.jpg">
     <source src="../media/poisson-fills-002.mp4" type="video/mp4"></source>
@@ -96,7 +96,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C210_Poisson_fills001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C210_Poisson_fills001.kt) 
  
 # Blending 
  
@@ -131,7 +131,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C210_Poisson_fills002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C210_Poisson_fills002.kt) 
  
 <video controls preload="none" loop poster="../media/poisson-fills-102-thumb.jpg">
     <source src="../media/poisson-fills-102.mp4" type="video/mp4"></source>
@@ -169,6 +169,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C210_Poisson_fills003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C210_Poisson_fills003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C210_Poisson_fills.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C210_Poisson_fills.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/quickUIs.markdown b/docs/ORX/quickUIs.markdown
index f6f09d25..39b316ab 100644
--- a/docs/ORX/quickUIs.markdown
+++ b/docs/ORX/quickUIs.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C180_Quick_UIs.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C180_Quick_UIs.kt' instead.
 layout: default
 title: Quick UIs
 parent: ORX
-last_modified_at: 2023.12.26 15:34:02 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 180
 has_children: false
 ---
@@ -52,7 +52,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C180_Quick_UIs000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C180_Quick_UIs000.kt) 
  
 <img alt="../media/quick-ui-001.jpg" src="../media/quick-ui-001.jpg" loading="lazy"> 
  
@@ -100,7 +100,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C180_Quick_UIs001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C180_Quick_UIs001.kt) 
  
 <video controls preload="none" loop poster="../media/quick-ui-003-thumb.jpg">
     <source src="../media/quick-ui-003.mp4" type="video/mp4"></source>
@@ -159,7 +159,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C180_Quick_UIs002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C180_Quick_UIs002.kt) 
  
 <video controls preload="none" loop poster="../media/quick-ui-004-thumb.jpg">
     <source src="../media/quick-ui-004.mp4" type="video/mp4"></source>
@@ -235,7 +235,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C180_Quick_UIs003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C180_Quick_UIs003.kt) 
  
 <video controls preload="none" loop poster="../media/quick-ui-005-thumb.jpg">
     <source src="../media/quick-ui-005.mp4" type="video/mp4"></source>
@@ -436,4 +436,4 @@ val settings = object {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C180_Quick_UIs.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C180_Quick_UIs.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/ORX/shadeStylePresets.markdown b/docs/ORX/shadeStylePresets.markdown
index a488c8e3..97020169 100644
--- a/docs/ORX/shadeStylePresets.markdown
+++ b/docs/ORX/shadeStylePresets.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_ORX/C190_Shade_style_presets.kt' instead.
+# Edit 'src/main/kotlin/docs/80_ORX/C190_Shade_style_presets.kt' instead.
 layout: default
 title: Shade style presets
 parent: ORX
-last_modified_at: 2023.12.26 15:59:48 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 190
 has_children: false
 ---
@@ -46,7 +46,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C190_Shade_style_presets000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C190_Shade_style_presets000.kt) 
  
 ## radialGradient 
  
@@ -73,7 +73,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C190_Shade_style_presets001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C190_Shade_style_presets001.kt) 
  
 ## angularGradient 
  
@@ -100,7 +100,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C190_Shade_style_presets002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C190_Shade_style_presets002.kt) 
  
 ## halfAngularGradient 
  
@@ -127,6 +127,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/10_ORX/C190_Shade_style_presets003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/80_ORX/C190_Shade_style_presets003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_ORX/C190_Shade_style_presets.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/80_ORX/C190_Shade_style_presets.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/ComputeShaders.markdown b/docs/advancedTopics/ComputeShaders.markdown
index e26f7686..c2cfd0d4 100644
--- a/docs/advancedTopics/ComputeShaders.markdown
+++ b/docs/advancedTopics/ComputeShaders.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C160_Compute_shaders.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C160_Compute_shaders.kt' instead.
 layout: default
 title: Compute shaders
 parent: Advanced topics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 160
 has_children: false
 ---
@@ -82,6 +82,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/11_Advanced_Topics/C160_Compute_shaders000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/90_Advanced_Topics/C160_Compute_shaders000.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C160_Compute_shaders.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C160_Compute_shaders.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/applicationFlow.markdown b/docs/advancedTopics/applicationFlow.markdown
index 45711e90..de65bef5 100644
--- a/docs/advancedTopics/applicationFlow.markdown
+++ b/docs/advancedTopics/applicationFlow.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C110_Application_Flow.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C110_Application_Flow.kt' instead.
 layout: default
 title: Application Flow
 parent: Advanced topics
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -73,4 +73,4 @@ fun main() {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C110_Application_Flow.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C110_Application_Flow.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/headlessApplications.markdown b/docs/advancedTopics/headlessApplications.markdown
index bec84261..8cad681a 100644
--- a/docs/advancedTopics/headlessApplications.markdown
+++ b/docs/advancedTopics/headlessApplications.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C140_Headless_applications.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C140_Headless_applications.kt' instead.
 layout: default
 title: Headless applications
 parent: Advanced topics
-last_modified_at: 2023.12.26 15:36:23 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 140
 has_children: false
 ---
@@ -41,4 +41,4 @@ Headless applications cannot handle mouse or keyboard input.
 Headless applications (currently) cannot create secondary/shared 
 contexts and as such ColorBufferLoader does not work. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C140_Headless_applications.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C140_Headless_applications.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/index.markdown b/docs/advancedTopics/index.markdown
index 7063e2d5..b2dfd232 100644
--- a/docs/advancedTopics/index.markdown
+++ b/docs/advancedTopics/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/index.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/index.kt' instead.
 layout: default
 title: Advanced topics
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1110
 has_children: true
 ---
  
 # Advanced topics 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/integerColorBuffers.markdown b/docs/advancedTopics/integerColorBuffers.markdown
index be361be8..2e57226c 100644
--- a/docs/advancedTopics/integerColorBuffers.markdown
+++ b/docs/advancedTopics/integerColorBuffers.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C155_Integer_ColorBuffers.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C155_Integer_ColorBuffers.kt' instead.
 layout: default
 title: Integer color buffers
 parent: Advanced topics
-last_modified_at: 2023.12.26 15:35:50 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 155
 has_children: false
 ---
@@ -87,4 +87,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C155_Integer_ColorBuffers.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C155_Integer_ColorBuffers.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/logging.markdown b/docs/advancedTopics/logging.markdown
index 1af5cf7a..5dae8533 100644
--- a/docs/advancedTopics/logging.markdown
+++ b/docs/advancedTopics/logging.markdown
@@ -1,12 +1,12 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C100_Logging.kt' instead.
+# Edit 'src/main/kotlin/docs/85_Debugging/index.kt' instead.
 layout: default
 title: Logging and debugging
-parent: Advanced topics
-last_modified_at: 2023.06.13 22:47:00 +0200
+parent: ~
+last_modified_at: 2024.01.15 12:42:19 +0100
 nav_order: 100
-has_children: false
+has_children: true
 ---
  
 # Logging
@@ -70,4 +70,4 @@ and Nintendo Switch™.
 explains how to use RenderDoc with OPENRNDR.
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C100_Logging.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/85_Debugging/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/lowLevelDrawing.markdown b/docs/advancedTopics/lowLevelDrawing.markdown
index 0c1571a4..8272cfe6 100644
--- a/docs/advancedTopics/lowLevelDrawing.markdown
+++ b/docs/advancedTopics/lowLevelDrawing.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C150_Lowlevel_drawing.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C150_Lowlevel_drawing.kt' instead.
 layout: default
 title: Low-level drawing
 parent: Advanced topics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 150
 has_children: false
 ---
@@ -98,6 +98,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/11_Advanced_Topics/C150_Lowlevel_drawing000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/90_Advanced_Topics/C150_Lowlevel_drawing000.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C150_Lowlevel_drawing.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C150_Lowlevel_drawing.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/presentationControl.markdown b/docs/advancedTopics/presentationControl.markdown
index d631d67a..71b58857 100644
--- a/docs/advancedTopics/presentationControl.markdown
+++ b/docs/advancedTopics/presentationControl.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C120_Presentation_Control.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C120_Presentation_Control.kt' instead.
 layout: default
 title: Presentation Control
 parent: Advanced topics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 120
 has_children: false
 ---
@@ -51,4 +51,4 @@ fun main() = application {
  
 Note that in manual presentation mode `draw()` is still called when the window is resized. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C120_Presentation_Control.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C120_Presentation_Control.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/advancedTopics/writingExtensions.markdown b/docs/advancedTopics/writingExtensions.markdown
index 935345dd..76624a1e 100644
--- a/docs/advancedTopics/writingExtensions.markdown
+++ b/docs/advancedTopics/writingExtensions.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/11_Advanced_Topics/C130_Writing_extensions.kt' instead.
+# Edit 'src/main/kotlin/docs/90_Advanced_Topics/C130_Writing_extensions.kt' instead.
 layout: default
 title: Writing extensions
 parent: Advanced topics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 130
 has_children: false
 ---
@@ -107,4 +107,4 @@ extensionA.afterDraw()
 As you can see, the afterDraw() calls are applied in reverse order, 
 this order was decided on to help with push/pop order of transforms and styles. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/11_Advanced_Topics/C130_Writing_extensions.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/90_Advanced_Topics/C130_Writing_extensions.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/animation/index.markdown b/docs/animation/index.markdown
index 166798a2..b1a51786 100644
--- a/docs/animation/index.markdown
+++ b/docs/animation/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/08_Animation/index.kt' instead.
+# Edit 'src/main/kotlin/docs/50_Animation/index.kt' instead.
 layout: default
 title: Animation
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1080
 has_children: true
 ---
  
 # Animation 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/08_Animation/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/50_Animation/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/animation/interactiveAnimations.markdown b/docs/animation/interactiveAnimations.markdown
index e4a8d42f..584a13be 100644
--- a/docs/animation/interactiveAnimations.markdown
+++ b/docs/animation/interactiveAnimations.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/08_Animation/C100_InteractiveAnimations.kt' instead.
+# Edit 'src/main/kotlin/docs/50_Animation/C100_InteractiveAnimations.kt' instead.
 layout: default
 title: Interactive animations
 parent: Animation
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -49,7 +49,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations000.kt) 
  
 By using `.complete()` we can create sequences of property animations. 
  
@@ -82,7 +82,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations001.kt) 
  
 If we leave out that `::x.complete()` line we will see that 
 animations for `x` and `y` run simultaneously.  
@@ -115,7 +115,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations002.kt) 
  
 For those wondering where that `::x.animate()` notation comes from, 
 those are Kotlin's [property references](https://kotlinlang.org/docs/reflection.html#property-references).
@@ -156,7 +156,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations003.kt) 
  
 ## Behavioral animation 
  
@@ -219,7 +219,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations004.kt) 
  
 ## Looping animations
 
@@ -256,7 +256,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/08_Animation/C100_InteractiveAnimations005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/50_Animation/C100_InteractiveAnimations005.kt) 
  
 ## Animatable properties
 
@@ -282,4 +282,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/08_Animation/C100_InteractiveAnimations.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/50_Animation/C100_InteractiveAnimations.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/debugging/logging.markdown b/docs/debugging/logging.markdown
new file mode 100644
index 00000000..c2a77a7a
--- /dev/null
+++ b/docs/debugging/logging.markdown
@@ -0,0 +1,73 @@
+---
+# File generated by dokgen. Do not edit. 
+# Edit 'src/main/kotlin/docs/85_Debugging/index.kt' instead.
+layout: default
+title: Logging and debugging
+parent: ~
+last_modified_at: 2024.01.15 13:08:17 +0100
+nav_order: 1105
+has_children: true
+---
+ 
+# Logging
+
+OPENRNDR uses kotlin-logging, which is a Kotlin flavoured wrapper 
+around slf4j, to log its internal workings. Log messages are displayed
+in the IDE's console and saved to the `application.log` file.
+
+##### Configure logging
+
+In [`build.gradle.kts`](https://github.com/openrndr/openrndr-template/blob/ff1942d2a821c540d7b7d804e201c6462890f7e2/build.gradle.kts#L84) 
+we can modify the `applicationLogging` variable.
+- `Logging.NONE` to disable logging.
+- `Logging.SIMPLE` to display monochrome log messages in the console.
+- `Logging.FULL` to display coloured log messages in the console to 
+distinguish their types.
+
+In [`src/main/resources/log4j2.yaml`](https://github.com/openrndr/openrndr-template/blob/ff1942d2a821c540d7b7d804e201c6462890f7e2/src/main/resources/log4j2.yaml#L18) 
+we can change the 
+[logging level](https://logging.apache.org/log4j/2.x/manual/customloglevels.html).
+To make it verbose we can replace `level: info` with `level: all`.
+
+##### Exception handling
+
+It is possible to change how exception errors are presented by adding
+`-Dorg.openrndr.exceptions=JVM` to the VM options under `Run > Edit 
+Configurations`. This can sometimes help figure out why a program is
+crashing.
+
+##### Crashing shaders
+
+If a ShadeStyle crashes, a `ShaderError.glsl` file is created at the
+root of the project. The content of the file is the actual shader
+program OPENRNDR tried to use. Studying this program can help figure out
+why shaders fail. A common reason is using incorrect names for methods,
+uniforms or variables.
+
+##### Debugging video exporting
+
+When a video file is produced, a `ffmpegOutput.txt` is created at the
+root of the project. Studying this file can help diagnose problems
+with video exporting.
+
+### Enabling OpenGL debug messages
+
+If your graphics hardware and drivers support OpenGL debug contexts 
+you can use `-Dorg.openrndr.gl3.debug=TRUE` to enable the debug messages.
+
+Open the `Run > Edit Configurations...` menu in
+IntelliJ and make sure the `VM Options` text field contains
+`-Dorg.openrndr.gl3.debug=true`.
+
+### Using RenderDoc
+
+[RenderDoc](https://renderdoc.org/) is 
+a graphics debugger currently available for Vulkan, D3D11, D3D12, 
+OpenGL, and OpenGL ES development on Windows, Linux, Android, Stadia, 
+and Nintendo Switch™.
+
+[This post](https://openrndr.discourse.group/t/using-renderdoc-to-debug-low-level-graphics-advanced/118)
+explains how to use RenderDoc with OPENRNDR.
+ 
+
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/85_Debugging/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/arrayTextures.markdown b/docs/drawing/arrayTextures.markdown
index c04836ff..3793cc42 100644
--- a/docs/drawing/arrayTextures.markdown
+++ b/docs/drawing/arrayTextures.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C370_Array_textures.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C370_Array_textures.kt' instead.
 layout: default
 title: Array textures
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 370
 has_children: false
 ---
@@ -206,6 +206,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C370_Array_textures000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C370_Array_textures000.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C370_Array_textures.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C370_Array_textures.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/asynchronousImageLoading.markdown b/docs/drawing/asynchronousImageLoading.markdown
index 78694a02..314417aa 100644
--- a/docs/drawing/asynchronousImageLoading.markdown
+++ b/docs/drawing/asynchronousImageLoading.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C330_Asynchronous_image_loading.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C330_Asynchronous_image_loading.kt' instead.
 layout: default
 title: Asynchronous image loading
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 330
 has_children: false
 ---
@@ -62,4 +62,4 @@ Cancelling an image which is queued (and is thus in `QUEUED` state) for
 loading is done by calling `.cancel()` on the `ColorBufferProxy`. 
 This will set the proxy state back to `NOT_LOADED`. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C330_Asynchronous_image_loading.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C330_Asynchronous_image_loading.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/circlesRectanglesLines.markdown b/docs/drawing/circlesRectanglesLines.markdown
index 250cfd3c..4f783363 100644
--- a/docs/drawing/circlesRectanglesLines.markdown
+++ b/docs/drawing/circlesRectanglesLines.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C100_CirclesRectanglesLines.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C100_CirclesRectanglesLines.kt' instead.
 layout: default
 title: Drawing circles, rectangles and lines
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -45,7 +45,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C100_CirclesRectanglesLines000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C100_CirclesRectanglesLines000.kt) 
  
 You may have spotted the two other APIs for drawing circles; `Drawer.circle(center: Vector2, radius: Double)` and `Drawer.circle(circle: Circle)` and wonder what those are for. They are for drawing the exact same circle, but using arguments that may be more convenient in scenarios in which values are provided by `Vector2` or `Circle` types. 
  
@@ -85,7 +85,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C100_CirclesRectanglesLines001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C100_CirclesRectanglesLines001.kt) 
  
 ## Drawing lines
 Single lines are drawn per segment between two pairs of coordinates using `lineSegment`. Line primitives use `Drawer.stroke` to determine the color drawing color and `Drawer.strokeWeight` to determine the width of the line.
@@ -122,7 +122,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C100_CirclesRectanglesLines002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C100_CirclesRectanglesLines002.kt) 
  
 ### Drawing line strips
 A run of connected line segments is called a line strip and is drawn using `lineStrip`.
@@ -147,6 +147,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C100_CirclesRectanglesLines003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C100_CirclesRectanglesLines003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C100_CirclesRectanglesLines.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C100_CirclesRectanglesLines.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/clipping.markdown b/docs/drawing/clipping.markdown
index 51ce89bb..534d7632 100644
--- a/docs/drawing/clipping.markdown
+++ b/docs/drawing/clipping.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C320_Clipping.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C320_Clipping.kt' instead.
 layout: default
 title: Clipping
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 320
 has_children: false
 ---
@@ -37,6 +37,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C320_Clipping000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C320_Clipping000.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C320_Clipping.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C320_Clipping.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/color.markdown b/docs/drawing/color.markdown
index 132caac1..7c90f739 100644
--- a/docs/drawing/color.markdown
+++ b/docs/drawing/color.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C130_Color.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C130_Color.kt' instead.
 layout: default
 title: Color
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 130
 has_children: false
 ---
@@ -91,7 +91,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C130_Color000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C130_Color000.kt) 
  
 Using `ColorRGBa.opacify` colors can be made more or less opaque. 
  
@@ -117,7 +117,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C130_Color001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C130_Color001.kt) 
  
 Using `mix(ColorRGBa, ColorRGBa, Double)` colors can be mixed. 
  
@@ -141,7 +141,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C130_Color002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C130_Color002.kt) 
  
 ## Alternative color models
 
@@ -228,6 +228,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C130_Color003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C130_Color003.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C130_Color.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C130_Color.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/colorbuffers.markdown b/docs/drawing/colorbuffers.markdown
index a590bbd1..c23ff06c 100644
--- a/docs/drawing/colorbuffers.markdown
+++ b/docs/drawing/colorbuffers.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C300_Colorbuffers.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C300_Colorbuffers.kt' instead.
 layout: default
 title: Color buffers
 parent: Drawing
-last_modified_at: 2023.12.26 13:13:23 +0100
+last_modified_at: 2024.01.19 13:14:29 +0100
 nav_order: 300
 has_children: false
 ---
@@ -51,6 +51,34 @@ Supported file types are png, jpg, dds and exr (OpenEXR).
 val cb = loadImage("data/images/pm5544.jpg")
 ``` 
  
+## Generating color buffers
+
+Use `drawImage` to create a color buffer and draw into it. 
+ 
+<img alt="../media/colorbuffer-001.jpg" src="../media/colorbuffer-001.jpg" loading="lazy"> 
+ 
+```kotlin
+fun main() = application {
+    program {
+        val gradientBackground = drawImage(width, height) {
+            // Draw anything here, for example a radial gradient.
+            drawer.shadeStyle = RadialGradient(ColorRGBa.WHITE, ColorRGBa.PINK)
+            val r = Rectangle.fromCenter(drawer.bounds.center, 800.0, 800.0)
+            drawer.rectangle(r)
+        }
+        extend {
+            drawer.image(gradientBackground)
+            drawer.circle(drawer.bounds.center, sin(seconds) * 80 + 100)
+        }
+    }
+}
+``` 
+ 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C300_Colorbuffers000.kt) 
+ 
+`drawImage` is convenient for creating static images. If a program requires redrawing 
+a color buffer use a [render target](/drawing/renderTargets.html) instead.
+    
 ## Freeing color buffers
 
 If a program creates new buffers while it runs
@@ -171,4 +199,4 @@ for (y in 0 until cb.height) {
 shadow.upload()
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C300_Colorbuffers.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C300_Colorbuffers.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/concurrencyAndMultithreading.markdown b/docs/drawing/concurrencyAndMultithreading.markdown
index 3ed49ca6..6fa8520e 100644
--- a/docs/drawing/concurrencyAndMultithreading.markdown
+++ b/docs/drawing/concurrencyAndMultithreading.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C360_Concurrency_and_multithreading.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C360_Concurrency_and_multithreading.kt' instead.
 layout: default
 title: Concurrency and multithreading
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 360
 has_children: false
 ---
@@ -162,4 +162,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C360_Concurrency_and_multithreading.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C360_Concurrency_and_multithreading.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/curvesAndShapes.markdown b/docs/drawing/curvesAndShapes.markdown
index 546e9ae8..01ae40fe 100644
--- a/docs/drawing/curvesAndShapes.markdown
+++ b/docs/drawing/curvesAndShapes.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C150_CurvesAndShapes.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C150_CurvesAndShapes.kt' instead.
 layout: default
 title: Curves and shapes
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.19 14:17:38 +0100
 nav_order: 150
 has_children: false
 ---
@@ -154,7 +154,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes002.kt) 
  
 ### Constructing a ShapeContour from points
 
@@ -189,7 +189,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes003.kt) 
  
 ### Constructing a ShapeContour from segments
 
@@ -215,7 +215,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes004.kt) 
  
 ### Constructing a ShapeContour from a primitive
 
@@ -298,13 +298,59 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes005.kt) 
  
 The list of available methods can be found at the 
 [API website](https://api.openrndr.org/openrndr-shape/org.openrndr.shape/-shape-contour/index.html) 
 or in the 
 [source code](https://github.com/openrndr/openrndr/tree/master/openrndr-shape/src/commonMain/kotlin/org/openrndr/shape).
 
+### Rectified ShapeContour
+
+The `ut` argument in the `ShapeContour.position()` and `ShapeContour.normal()` methods
+[does not specify a linear position](https://api.openrndr.org/openrndr-shape/org.openrndr.shape/-shape-contour/position.html) 
+between the start and the end of the contour.
+
+By using rectified contours (defined in `orx-shapes`) we can
+work with evenly spaced points on contours, or animate elements
+traveling on a contour at the desired speed even if the
+contour segments vary greatly in length. 
+ 
+<video controls preload="none" loop poster="../media/shapes-contour-rectified-001-thumb.jpg">
+    <source src="../media/shapes-contour-rectified-001.mp4" type="video/mp4"></source>
+</video>
+ 
+ 
+```kotlin
+fun main() = application {
+    program {
+        val c = Pulley(Circle(Vector2.ZERO, 30.0), Circle(Vector2.ONE * 120.0, 60.0)).contour
+        val cr = c.rectified()
+        
+        extend {
+            drawer.clear(ColorRGBa.WHITE)
+            drawer.fill = null
+            
+            // Go from 0.0 to 1.0 in two seconds
+            // slowing down at both ends
+            val t = cos(kotlin.math.PI * (seconds % 2.0) / 2.0) * 0.5 + 0.5
+            
+            drawer.translate(150.0, 100.0)
+            drawer.contour(c)
+            // Note how segment length affects the speed
+            drawer.circle(c.position(t), 5.0)
+            
+            drawer.translate(270.0, 0.0)
+            drawer.contour(c)
+            // The rectified contour provides a smooth animation
+            drawer.circle(cr.position(t), 5.0)
+        }
+    }
+}
+``` 
+ 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes006.kt) 
+ 
 ### Modifying a ShapeContour
 
 #### sub()
@@ -338,7 +384,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes006.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes007.kt) 
  
 #### offset()
 
@@ -369,7 +415,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes007.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes008.kt) 
  
 `ShapeContour.offset` can also be used to offset curved contours. 
 The following demonstration shows a single cubic bezier offset at multiple 
@@ -401,7 +447,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes008.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes009.kt) 
  
 #### reversed, close(), transform(), ...
 
@@ -453,7 +499,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes009.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes010.kt) 
  
 ### Constructing a Shape from a primitive
 
@@ -511,7 +557,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes010.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes011.kt) 
  
 The _compound builder_ is actually a bit more clever than what the 
 previous example demonstrated because it can actually work with an 
@@ -545,7 +591,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes011.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes012.kt) 
  
 ## Intersections
 
@@ -591,6 +637,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C150_CurvesAndShapes012.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C150_CurvesAndShapes013.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C150_CurvesAndShapes.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C150_CurvesAndShapes.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/customRendering.markdown b/docs/drawing/customRendering.markdown
index 59b929f7..73932cf3 100644
--- a/docs/drawing/customRendering.markdown
+++ b/docs/drawing/customRendering.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C350_Custom_rendering.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C350_Custom_rendering.kt' instead.
 layout: default
 title: Custom rendering
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 350
 has_children: false
 ---
@@ -121,7 +121,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C350_Custom_rendering000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C350_Custom_rendering000.kt) 
  
 ## Shading geometry
 
@@ -158,7 +158,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C350_Custom_rendering001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C350_Custom_rendering001.kt) 
  
 ## Drawing instances
 
@@ -216,6 +216,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C350_Custom_rendering002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C350_Custom_rendering002.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C350_Custom_rendering.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C350_Custom_rendering.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/drawingPrimitivesBatched.markdown b/docs/drawing/drawingPrimitivesBatched.markdown
index 4e87c965..948700df 100644
--- a/docs/drawing/drawingPrimitivesBatched.markdown
+++ b/docs/drawing/drawingPrimitivesBatched.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C180_DrawingPrimitivesBatched.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C180_DrawingPrimitivesBatched.kt' instead.
 layout: default
 title: Drawing primitives batched
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 180
 has_children: false
 ---
@@ -52,7 +52,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C180_DrawingPrimitivesBatched000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C180_DrawingPrimitivesBatched000.kt) 
  
 `drawer.circles` has several signatures. One of them accepts a list of 
 `Vector2` for the circle centers and a `Double` to specify the radius for 
@@ -89,7 +89,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C180_DrawingPrimitivesBatched001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C180_DrawingPrimitivesBatched001.kt) 
  
 What about unique colors and `strokeWeight`s per circle? 
 Creating static or dynamic batches makes it possible, 
@@ -129,7 +129,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C180_DrawingPrimitivesBatched002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C180_DrawingPrimitivesBatched002.kt) 
  
 ## Batched rectangles
 
@@ -183,7 +183,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C180_DrawingPrimitivesBatched003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C180_DrawingPrimitivesBatched003.kt) 
  
 ## Batched points
 
@@ -210,6 +210,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C180_DrawingPrimitivesBatched004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C180_DrawingPrimitivesBatched004.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C180_DrawingPrimitivesBatched.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C180_DrawingPrimitivesBatched.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/drawingSVG.markdown b/docs/drawing/drawingSVG.markdown
index 44e55e0e..60efcf4f 100644
--- a/docs/drawing/drawingSVG.markdown
+++ b/docs/drawing/drawingSVG.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C160_DrawingSvg.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C160_DrawingSvg.kt' instead.
 layout: default
 title: Drawing SVG
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 160
 has_children: false
 ---
@@ -147,4 +147,4 @@ val composition = loadSVG("data/example.svg")
 composition.saveToFile(File("output.svg"))
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C160_DrawingSvg.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C160_DrawingSvg.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/filtersAndPostProcessing.markdown b/docs/drawing/filtersAndPostProcessing.markdown
index f45e7a80..a2e90624 100644
--- a/docs/drawing/filtersAndPostProcessing.markdown
+++ b/docs/drawing/filtersAndPostProcessing.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C310_Filters_and_post_processing.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C310_Filters_and_post_processing.kt' instead.
 layout: default
 title: Filters and post processing
 parent: Drawing
-last_modified_at: 2023.12.26 15:38:14 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 310
 has_children: false
 ---
@@ -61,7 +61,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C310_Filters_and_post_processing000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C310_Filters_and_post_processing000.kt) 
  
 ## Writing your own filters
 
@@ -145,7 +145,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C310_Filters_and_post_processing001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C310_Filters_and_post_processing001.kt) 
  
 ## The orx-fx library
 
@@ -154,4 +154,4 @@ the [ORX repository](https://github.com/openrndr/orx/tree/master/orx-fx),
 a partial index of the filters can be found in the 
 [orx-fx chapter](https://guide.openrndr.org/ORX/imageFilters.html) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C310_Filters_and_post_processing.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C310_Filters_and_post_processing.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/images.markdown b/docs/drawing/images.markdown
index 05e5e9bc..4bcc2d27 100644
--- a/docs/drawing/images.markdown
+++ b/docs/drawing/images.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C110_Images.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C110_Images.kt' instead.
 layout: default
 title: Images
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -32,7 +32,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images000.kt) 
  
 To change the location of the image one can use `Drawer.image` with extra coordinates provided. 
  
@@ -67,7 +67,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images001.kt) 
  
 ## Drawing many parts of images 
  
@@ -92,7 +92,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images002.kt) 
  
 ## Changing the appearance of images
 
@@ -117,7 +117,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images003.kt) 
  
 ### Inverting
 
@@ -138,7 +138,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images004.kt) 
  
 ### Grayscale
 
@@ -160,7 +160,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images005.kt) 
  
 ### Concatenating color transforms
 
@@ -184,6 +184,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C110_Images006.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C110_Images006.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C110_Images.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C110_Images.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/index.markdown b/docs/drawing/index.markdown
index 44dc6394..a1123079 100644
--- a/docs/drawing/index.markdown
+++ b/docs/drawing/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/index.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/index.kt' instead.
 layout: default
 title: Drawing
 parent: ~
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1040
 has_children: true
 ---
  
 # Drawing 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/managingDrawStyle.markdown b/docs/drawing/managingDrawStyle.markdown
index ca29f19d..9de06ae1 100644
--- a/docs/drawing/managingDrawStyle.markdown
+++ b/docs/drawing/managingDrawStyle.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C140_ManagingDrawStyle.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C140_ManagingDrawStyle.kt' instead.
 layout: default
 title: Managing draw style
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 140
 has_children: false
 ---
@@ -68,4 +68,4 @@ extend {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C140_ManagingDrawStyle.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C140_ManagingDrawStyle.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/quaternions.markdown b/docs/drawing/quaternions.markdown
index cf052a30..ca2587e7 100644
--- a/docs/drawing/quaternions.markdown
+++ b/docs/drawing/quaternions.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C220_Quaternions.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C220_Quaternions.kt' instead.
 layout: default
 title: Quaternions
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 220
 has_children: false
 ---
@@ -51,4 +51,4 @@ val q0 = fromAngles(pitch, yaw, roll)
 drawer.model *= q0.matrix.matrix44
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C220_Quaternions.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C220_Quaternions.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/renderTargets.markdown b/docs/drawing/renderTargets.markdown
index e66cd39c..006af5d7 100644
--- a/docs/drawing/renderTargets.markdown
+++ b/docs/drawing/renderTargets.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C305_Render_targets.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C305_Render_targets.kt' instead.
 layout: default
 title: Render targets
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.19 14:31:50 +0100
 nav_order: 305
 has_children: false
 ---
@@ -44,9 +44,10 @@ val rt = renderTarget(640, 480) {
  
 ## Drawing on a render target
 
-In the following code snippet you will find an example showing how to 
-draw on an off-screen buffer followed by drawing that offscreen buffer 
-on screen. 
+Use `drawer.isolatedWithTarget()` to draw into an off-screen buffer.
+ 
+Once updated, we can either draw it onto the screen (as this example shows) 
+or process its color buffer further using [filters](/ORX/imageFilters.html) or custom shaders. 
  
 ```kotlin
 fun main() = application {
@@ -239,4 +240,4 @@ val rt = renderTarget(640, 480) {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C305_Render_targets.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C305_Render_targets.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/shadeStyles.markdown b/docs/drawing/shadeStyles.markdown
index f2088fb5..2bec6564 100644
--- a/docs/drawing/shadeStyles.markdown
+++ b/docs/drawing/shadeStyles.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C340_Shade_styles.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C340_Shade_styles.kt' instead.
 layout: default
 title: Shade styles
 parent: Drawing
-last_modified_at: 2023.12.26 15:57:27 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 340
 has_children: false
 ---
@@ -51,7 +51,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles000.kt) 
  
 The idea of shade styles is to allow more complex changes in the appearance. 
 In the next snippet we create
@@ -77,7 +77,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles001.kt) 
  
 In the next step we introduce animation by adding an external clock signal 
 to the shade style. Shade styles have _parameters_ that can be used for this.
@@ -110,7 +110,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles002.kt) 
  
 ## Usage examples
 
@@ -149,7 +149,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles003.kt) 
  
 ### 3D mesh distortion
 
@@ -197,7 +197,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles004.kt) 
  
 ## The shade style language
 
@@ -389,7 +389,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C340_Shade_styles005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C340_Shade_styles005.kt) 
  
 ## Debugging tip
 
@@ -403,4 +403,4 @@ attributes and uniforms are available and to figure out why your program fails
 in case the syntax error was not intentional.
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C340_Shade_styles.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C340_Shade_styles.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/text.markdown b/docs/drawing/text.markdown
index f2a49c8c..1a400a90 100644
--- a/docs/drawing/text.markdown
+++ b/docs/drawing/text.markdown
@@ -1,11 +1,11 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C120_Text.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C155_Text.kt' instead.
 layout: default
 title: Text
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
-nav_order: 120
+last_modified_at: 2024.01.19 13:20:46 +0100
+nav_order: 155
 has_children: false
 ---
  
@@ -13,7 +13,11 @@ has_children: false
 
 OPENRNDR comes with support for rendering bitmap text. There are two modes of operation for writing text, a direct
 mode that simply writes a string of text at the requested position, and a more advanced mode that can place texts 
-in a designated text area. 
+in a designated text area.
+
+As an alternative to bitmap texts, which are stored as an image containing characters
+rendered at a specific size, it is also possible to obtain glyph contours 
+to draw texts at any scale and to query curve properties. 
  
 ## Simple text rendering
 
@@ -37,7 +41,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C120_Text000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text000.kt) 
  
 ## Advanced text rendering
 
@@ -74,7 +78,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C120_Text001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text001.kt) 
  
 ### Specifying the text area
 
@@ -111,7 +115,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C120_Text002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text002.kt) 
  
 ### Text properties
 
@@ -154,6 +158,81 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C120_Text003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text003.kt) 
+ 
+### Working with text contours
+
+To load the vector data of a font file use the `loadFace()` method,
+then call the `.glyphForCharacter()` method to obtain a 
+[Shape](https://guide.openrndr.org/drawing/curvesAndShapes.html#shape) representing
+a character. 
+ 
+<img alt="../media/text-004.jpg" src="../media/text-004.jpg" loading="lazy"> 
+ 
+```kotlin
+fun main() = application {
+    program {
+        val face = loadFace("data/fonts/default.otf")
+        val shape = face.glyphForCharacter(character = '8').shape(size = 750.0)
+        
+        extend {
+            drawer.clear(ColorRGBa.WHITE)
+            // Center the shape on the screen
+            drawer.translate(drawer.bounds.center - shape.bounds.center)
+            
+            drawer.fill = null
+            drawer.strokeWeight = 2.0
+            
+            // Draw each contour found in the character '8' with a different color
+            shape.contours.forEachIndexed { i, it ->
+                drawer.stroke = listOf(ColorRGBa.PINK, rgb(0.33), rgb(0.66))[i]
+                drawer.contour(it)
+            }
+        }
+    }
+}
+``` 
+ 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text004.kt) 
+ 
+This example visualizes normal vectors around the contour of
+the character '8', evenly spaced every 10 pixels. 
+ 
+<img alt="../media/text-005.jpg" src="../media/text-005.jpg" loading="lazy"> 
+ 
+```kotlin
+fun main() = application {
+    program {
+        val face = loadFace("data/fonts/default.otf")
+        val shape = face.glyphForCharacter('8').shape(750.0)
+        
+        // Map each contour in the shape to a list of LineSegment,
+        // then combine the resulting lists by calling `.flatten()`.
+        val normals = shape.contours.map { c ->
+            // Work with rectified contours so `t` values are evenly spaced.
+            val rc = c.rectified()
+            val stepCount = (c.length / 10).toInt()
+            List(stepCount) {
+                val t = it / stepCount.toDouble()
+                LineSegment(rc.position(t) + rc.normal(t) * 5.0, rc.position(t) + rc.normal(t) * 20.0)
+            }
+        }.flatten()
+        extend {
+            drawer.clear(ColorRGBa.WHITE)
+            drawer.translate(drawer.bounds.center - shape.bounds.center)
+            
+            drawer.fill = ColorRGBa.PINK
+            drawer.stroke = null
+            drawer.shape(shape)
+            
+            drawer.stroke = ColorRGBa.BLACK
+            drawer.strokeWeight = 2.0
+            drawer.lineSegments(normals)
+        }
+    }
+}
+``` 
+ 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C155_Text005.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C120_Text.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C155_Text.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/transformations.markdown b/docs/drawing/transformations.markdown
index 1b199c58..5eddc8b5 100644
--- a/docs/drawing/transformations.markdown
+++ b/docs/drawing/transformations.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C200_Transformations.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C200_Transformations.kt' instead.
 layout: default
 title: Transformations
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 200
 has_children: false
 ---
@@ -44,7 +44,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations000.kt) 
  
 translations (and transformations in general) can be stacked 
 on top of each-other. For example we can express a horizontal and a vertical 
@@ -78,7 +78,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations001.kt) 
  
 ### Rotations
 
@@ -117,7 +117,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations002.kt) 
  
 ### Scaling
 
@@ -152,7 +152,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations003.kt) 
  
 ### Combining transformations 
  
@@ -187,7 +187,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations004.kt) 
  
 <video controls preload="none" loop poster="../media/transformations-006-thumb.jpg">
     <source src="../media/transformations-006.mp4" type="video/mp4"></source>
@@ -221,7 +221,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/04_Drawing/C200_Transformations005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/30_Drawing/C200_Transformations005.kt) 
  
 ## Transform pipeline
 
@@ -303,4 +303,4 @@ drawer.scale(2.0)
 ```
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C200_Transformations.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C200_Transformations.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/tridimensionalGraphics.markdown b/docs/drawing/tridimensionalGraphics.markdown
index a71cbae5..90517723 100644
--- a/docs/drawing/tridimensionalGraphics.markdown
+++ b/docs/drawing/tridimensionalGraphics.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C170_TridimensionalGraphics.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C170_TridimensionalGraphics.kt' instead.
 layout: default
 title: Tridimensional graphics
 parent: Drawing
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 170
 has_children: false
 ---
@@ -109,4 +109,4 @@ To avoid such issues you can create your own vertex buffers and meshes.
 - [orx-dnk3](https://github.com/openrndr/orx/tree/master/orx-jvm/orx-dnk3)
 - [orx-mesh-generators](https://github.com/openrndr/orx/tree/master/orx-mesh-generators) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C170_TridimensionalGraphics.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C170_TridimensionalGraphics.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/drawing/vectors.markdown b/docs/drawing/vectors.markdown
index 5ac9a5ce..8dbe54dc 100644
--- a/docs/drawing/vectors.markdown
+++ b/docs/drawing/vectors.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/04_Drawing/C210_Vectors.kt' instead.
+# Edit 'src/main/kotlin/docs/30_Drawing/C210_Vectors.kt' instead.
 layout: default
 title: Vectors
 parent: Drawing
-last_modified_at: 2023.12.26 15:57:56 +0100
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 210
 has_children: false
 ---
@@ -121,4 +121,4 @@ To generate random distributions of vectors see
 [orx-noise](https://guide.openrndr.org/ORX/noise.html).
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/04_Drawing/C210_Vectors.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/30_Drawing/C210_Vectors.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/fileIO/index.markdown b/docs/fileIO/index.markdown
index aacd7785..57b6de1f 100644
--- a/docs/fileIO/index.markdown
+++ b/docs/fileIO/index.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/10_FileIO/index.kt' instead.
+# Edit 'src/main/kotlin/docs/70_FileIO/index.kt' instead.
 layout: default
 title: File Input / Output
 parent: ~
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1095
 has_children: true
 ---
@@ -191,4 +191,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_FileIO/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/70_FileIO/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/clipboard.markdown b/docs/interaction/clipboard.markdown
index 1b2e1278..217f9e8e 100644
--- a/docs/interaction/clipboard.markdown
+++ b/docs/interaction/clipboard.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/C130_Clipboard.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/C130_Clipboard.kt' instead.
 layout: default
 title: Clipboard
 parent: Interaction
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 130
 has_children: false
 ---
@@ -37,4 +37,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/C130_Clipboard.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/C130_Clipboard.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/fileDrops.markdown b/docs/interaction/fileDrops.markdown
index 02fdde53..1d9f48d7 100644
--- a/docs/interaction/fileDrops.markdown
+++ b/docs/interaction/fileDrops.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/C120_FileDrops.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/C120_FileDrops.kt' instead.
 layout: default
 title: File Drops
 parent: Interaction
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 120
 has_children: false
 ---
@@ -23,4 +23,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/C120_FileDrops.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/C120_FileDrops.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/index.markdown b/docs/interaction/index.markdown
index 91cd5c28..c83777da 100644
--- a/docs/interaction/index.markdown
+++ b/docs/interaction/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/index.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/index.kt' instead.
 layout: default
 title: Interaction
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1070
 has_children: true
 ---
  
 # Interaction 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/mouseAndKeyboardEvents.markdown b/docs/interaction/mouseAndKeyboardEvents.markdown
index 74ef59de..7dfe357d 100644
--- a/docs/interaction/mouseAndKeyboardEvents.markdown
+++ b/docs/interaction/mouseAndKeyboardEvents.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/C100_MouseAndKeyboardEvents.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/C100_MouseAndKeyboardEvents.kt' instead.
 layout: default
 title: Mouse And Keyboard Events
 parent: Interaction
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -190,4 +190,4 @@ constant             |  description
 Mouse and keyboard events are buffered and processed before `draw()` 
 is called. It is possible but not advised to perform drawing on event. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/C100_MouseAndKeyboardEvents.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/C100_MouseAndKeyboardEvents.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/programWindows.markdown b/docs/interaction/programWindows.markdown
index 1f11724d..73c4530c 100644
--- a/docs/interaction/programWindows.markdown
+++ b/docs/interaction/programWindows.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/C110_ProgramWindows.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/C110_ProgramWindows.kt' instead.
 layout: default
 title: Program Windows
 parent: Interaction
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -101,4 +101,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/C110_ProgramWindows.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/C110_ProgramWindows.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/interaction/userInterfaces.markdown b/docs/interaction/userInterfaces.markdown
index 7e56f2f9..a231f623 100644
--- a/docs/interaction/userInterfaces.markdown
+++ b/docs/interaction/userInterfaces.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/07_Interaction/C140_UserInterfaces.kt' instead.
+# Edit 'src/main/kotlin/docs/40_Interaction/C140_UserInterfaces.kt' instead.
 layout: default
 title: User Interfaces
 parent: Interaction
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 140
 has_children: false
 ---
@@ -53,7 +53,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces000.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces000.kt) 
  
 ## Style sheets
 
@@ -84,7 +84,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces001.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces001.kt) 
  
 ### Selectors
 
@@ -166,7 +166,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces002.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces002.kt) 
  
 ### Slider
 
@@ -205,7 +205,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces003.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces003.kt) 
  
 ### ColorPickerButton
 
@@ -241,7 +241,7 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces004.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces004.kt) 
  
 ### DropdownButton
 
@@ -286,6 +286,6 @@ fun main() = application {
 }
 ``` 
  
-[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/07_Interaction/C140_UserInterfaces005.kt) 
+[Link to the full example](https://github.com/openrndr/openrndr-examples/blob/master/src/main/kotlin/examples/40_Interaction/C140_UserInterfaces005.kt) 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/07_Interaction/C140_UserInterfaces.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/40_Interaction/C140_UserInterfaces.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/kotlinLanguageAndTools/gradle.markdown b/docs/kotlinLanguageAndTools/gradle.markdown
index e3c5489b..7e0beb43 100644
--- a/docs/kotlinLanguageAndTools/gradle.markdown
+++ b/docs/kotlinLanguageAndTools/gradle.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/02_Kotlin_lang_and_tools/C110_Gradle.kt' instead.
+# Edit 'src/main/kotlin/docs/10_Kotlin_lang_and_tools/C110_Gradle.kt' instead.
 layout: default
 title: What is Gradle?
 parent: Kotlin language and tools
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -84,4 +84,4 @@ Gradle is an excellent fit for Kotlin-based projects because Kotlin itself can b
 avoiding the need to work with additional languages. 
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/02_Kotlin_lang_and_tools/C110_Gradle.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_Kotlin_lang_and_tools/C110_Gradle.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/kotlinLanguageAndTools/index.markdown b/docs/kotlinLanguageAndTools/index.markdown
index 8eb77dc1..f46ec37e 100644
--- a/docs/kotlinLanguageAndTools/index.markdown
+++ b/docs/kotlinLanguageAndTools/index.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/02_Kotlin_lang_and_tools/index.kt' instead.
+# Edit 'src/main/kotlin/docs/10_Kotlin_lang_and_tools/index.kt' instead.
 layout: default
 title: Kotlin language and tools
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1020
 has_children: true
 ---
@@ -18,4 +18,4 @@ The Gradle build tool is used by the OPENRNDR projects
 to download dependencies, build and distribute projects.
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/02_Kotlin_lang_and_tools/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_Kotlin_lang_and_tools/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/kotlinLanguageAndTools/kotlin.markdown b/docs/kotlinLanguageAndTools/kotlin.markdown
index 6eb1ee74..fa9f3761 100644
--- a/docs/kotlinLanguageAndTools/kotlin.markdown
+++ b/docs/kotlinLanguageAndTools/kotlin.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/02_Kotlin_lang_and_tools/C100_KotlinLanguageIntro.kt' instead.
+# Edit 'src/main/kotlin/docs/10_Kotlin_lang_and_tools/C100_KotlinLanguageIntro.kt' instead.
 layout: default
 title: Introduction to Kotlin
 parent: Kotlin language and tools
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -41,4 +41,4 @@ working with Kotlin enjoyable. Check them out!
 An introduction to Kotlin focused on OPENRNDR will follow soon :-)
  
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/02_Kotlin_lang_and_tools/C100_KotlinLanguageIntro.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/10_Kotlin_lang_and_tools/C100_KotlinLanguageIntro.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/media/animations-301-thumb.jpg b/docs/media/animations-301-thumb.jpg
index 71ad2ebc..e4008c19 100644
Binary files a/docs/media/animations-301-thumb.jpg and b/docs/media/animations-301-thumb.jpg differ
diff --git a/docs/media/animations-301.mp4 b/docs/media/animations-301.mp4
index 31ecf84f..63476448 100644
Binary files a/docs/media/animations-301.mp4 and b/docs/media/animations-301.mp4 differ
diff --git a/docs/media/batching-circles-001.jpg b/docs/media/batching-circles-001.jpg
index c0e1060b..395825b8 100644
Binary files a/docs/media/batching-circles-001.jpg and b/docs/media/batching-circles-001.jpg differ
diff --git a/docs/media/batching-circles-003.jpg b/docs/media/batching-circles-003.jpg
index acd445c4..116df066 100644
Binary files a/docs/media/batching-circles-003.jpg and b/docs/media/batching-circles-003.jpg differ
diff --git a/docs/media/batching-rectangles-001.jpg b/docs/media/batching-rectangles-001.jpg
index a01719e5..7ae01deb 100644
Binary files a/docs/media/batching-rectangles-001.jpg and b/docs/media/batching-rectangles-001.jpg differ
diff --git a/docs/media/colorbuffer-001.jpg b/docs/media/colorbuffer-001.jpg
new file mode 100644
index 00000000..07e70dbd
Binary files /dev/null and b/docs/media/colorbuffer-001.jpg differ
diff --git a/docs/media/compositor-004-thumb.jpg b/docs/media/compositor-004-thumb.jpg
index b62096fa..44c48432 100644
Binary files a/docs/media/compositor-004-thumb.jpg and b/docs/media/compositor-004-thumb.jpg differ
diff --git a/docs/media/compositor-004.mp4 b/docs/media/compositor-004.mp4
index e498eee1..b2ce5954 100644
Binary files a/docs/media/compositor-004.mp4 and b/docs/media/compositor-004.mp4 differ
diff --git a/docs/media/compositor-005-thumb.jpg b/docs/media/compositor-005-thumb.jpg
index 51da7280..d1c9894f 100644
Binary files a/docs/media/compositor-005-thumb.jpg and b/docs/media/compositor-005-thumb.jpg differ
diff --git a/docs/media/compositor-005.mp4 b/docs/media/compositor-005.mp4
index 11ca5cc6..70dc21c6 100644
Binary files a/docs/media/compositor-005.mp4 and b/docs/media/compositor-005.mp4 differ
diff --git a/docs/media/compositor-006-thumb.jpg b/docs/media/compositor-006-thumb.jpg
index 974b806c..cde8aa61 100644
Binary files a/docs/media/compositor-006-thumb.jpg and b/docs/media/compositor-006-thumb.jpg differ
diff --git a/docs/media/compositor-006.mp4 b/docs/media/compositor-006.mp4
index 7aa05105..19fc89a4 100644
Binary files a/docs/media/compositor-006.mp4 and b/docs/media/compositor-006.mp4 differ
diff --git a/docs/media/custom-rendering-001.jpg b/docs/media/custom-rendering-001.jpg
index 035eee01..23164983 100644
Binary files a/docs/media/custom-rendering-001.jpg and b/docs/media/custom-rendering-001.jpg differ
diff --git a/docs/media/custom-rendering-002.jpg b/docs/media/custom-rendering-002.jpg
index 5ca26a83..c74ea7a7 100644
Binary files a/docs/media/custom-rendering-002.jpg and b/docs/media/custom-rendering-002.jpg differ
diff --git a/docs/media/custom-rendering-003.jpg b/docs/media/custom-rendering-003.jpg
index a7dbf063..8959828b 100644
Binary files a/docs/media/custom-rendering-003.jpg and b/docs/media/custom-rendering-003.jpg differ
diff --git a/docs/media/filters-003-thumb.jpg b/docs/media/filters-003-thumb.jpg
index 55be2033..58962075 100644
Binary files a/docs/media/filters-003-thumb.jpg and b/docs/media/filters-003-thumb.jpg differ
diff --git a/docs/media/filters-003.mp4 b/docs/media/filters-003.mp4
index 54420eeb..9e3d8a3d 100644
Binary files a/docs/media/filters-003.mp4 and b/docs/media/filters-003.mp4 differ
diff --git a/docs/media/lowlevel-drawing-001.jpg b/docs/media/lowlevel-drawing-001.jpg
index 792e9115..011c21ef 100644
Binary files a/docs/media/lowlevel-drawing-001.jpg and b/docs/media/lowlevel-drawing-001.jpg differ
diff --git a/docs/media/orx-noise-001.jpg b/docs/media/orx-noise-001.jpg
index 1188321b..1a113edd 100644
Binary files a/docs/media/orx-noise-001.jpg and b/docs/media/orx-noise-001.jpg differ
diff --git a/docs/media/quick-ui-001.jpg b/docs/media/quick-ui-001.jpg
index c482b330..f6660460 100644
Binary files a/docs/media/quick-ui-001.jpg and b/docs/media/quick-ui-001.jpg differ
diff --git a/docs/media/quick-ui-003-thumb.jpg b/docs/media/quick-ui-003-thumb.jpg
index 3de54a5f..698b1831 100644
Binary files a/docs/media/quick-ui-003-thumb.jpg and b/docs/media/quick-ui-003-thumb.jpg differ
diff --git a/docs/media/quick-ui-003.mp4 b/docs/media/quick-ui-003.mp4
index b92c61b2..ab239cdd 100644
Binary files a/docs/media/quick-ui-003.mp4 and b/docs/media/quick-ui-003.mp4 differ
diff --git a/docs/media/quick-ui-004-thumb.jpg b/docs/media/quick-ui-004-thumb.jpg
index fa9338b6..ffa8428a 100644
Binary files a/docs/media/quick-ui-004-thumb.jpg and b/docs/media/quick-ui-004-thumb.jpg differ
diff --git a/docs/media/quick-ui-004.mp4 b/docs/media/quick-ui-004.mp4
index 4821b5c0..0ad2ea02 100644
Binary files a/docs/media/quick-ui-004.mp4 and b/docs/media/quick-ui-004.mp4 differ
diff --git a/docs/media/quick-ui-005-thumb.jpg b/docs/media/quick-ui-005-thumb.jpg
index 520cdc7a..b939db2f 100644
Binary files a/docs/media/quick-ui-005-thumb.jpg and b/docs/media/quick-ui-005-thumb.jpg differ
diff --git a/docs/media/quick-ui-005.mp4 b/docs/media/quick-ui-005.mp4
index 08d9d5e1..af7eb4a6 100644
Binary files a/docs/media/quick-ui-005.mp4 and b/docs/media/quick-ui-005.mp4 differ
diff --git a/docs/media/shade-style-presets-001-thumb.jpg b/docs/media/shade-style-presets-001-thumb.jpg
index 8a212f70..03b5b9e2 100644
Binary files a/docs/media/shade-style-presets-001-thumb.jpg and b/docs/media/shade-style-presets-001-thumb.jpg differ
diff --git a/docs/media/shade-style-presets-001.mp4 b/docs/media/shade-style-presets-001.mp4
index b11091b6..c5df23d5 100644
Binary files a/docs/media/shade-style-presets-001.mp4 and b/docs/media/shade-style-presets-001.mp4 differ
diff --git a/docs/media/shade-style-presets-002-thumb.jpg b/docs/media/shade-style-presets-002-thumb.jpg
index 74596c52..7fd2159c 100644
Binary files a/docs/media/shade-style-presets-002-thumb.jpg and b/docs/media/shade-style-presets-002-thumb.jpg differ
diff --git a/docs/media/shade-style-presets-002.mp4 b/docs/media/shade-style-presets-002.mp4
index cd41da73..715282a2 100644
Binary files a/docs/media/shade-style-presets-002.mp4 and b/docs/media/shade-style-presets-002.mp4 differ
diff --git a/docs/media/shade-style-presets-003-thumb.jpg b/docs/media/shade-style-presets-003-thumb.jpg
index 7339d97f..773b8638 100644
Binary files a/docs/media/shade-style-presets-003-thumb.jpg and b/docs/media/shade-style-presets-003-thumb.jpg differ
diff --git a/docs/media/shade-style-presets-003.mp4 b/docs/media/shade-style-presets-003.mp4
index 5b2cca99..d3f2d5da 100644
Binary files a/docs/media/shade-style-presets-003.mp4 and b/docs/media/shade-style-presets-003.mp4 differ
diff --git a/docs/media/shade-style-presets-004-thumb.jpg b/docs/media/shade-style-presets-004-thumb.jpg
index 7dd45141..a1e441eb 100644
Binary files a/docs/media/shade-style-presets-004-thumb.jpg and b/docs/media/shade-style-presets-004-thumb.jpg differ
diff --git a/docs/media/shade-style-presets-004.mp4 b/docs/media/shade-style-presets-004.mp4
index f72cdd39..c65015f5 100644
Binary files a/docs/media/shade-style-presets-004.mp4 and b/docs/media/shade-style-presets-004.mp4 differ
diff --git a/docs/media/shapes-contour-rectified-001-thumb.jpg b/docs/media/shapes-contour-rectified-001-thumb.jpg
new file mode 100644
index 00000000..6b790e44
Binary files /dev/null and b/docs/media/shapes-contour-rectified-001-thumb.jpg differ
diff --git a/docs/media/shapes-contour-rectified-001.mp4 b/docs/media/shapes-contour-rectified-001.mp4
new file mode 100644
index 00000000..37287e94
Binary files /dev/null and b/docs/media/shapes-contour-rectified-001.mp4 differ
diff --git a/docs/media/shapes-contour-rectified-001.png b/docs/media/shapes-contour-rectified-001.png
new file mode 100644
index 00000000..edd21f3c
Binary files /dev/null and b/docs/media/shapes-contour-rectified-001.png differ
diff --git a/docs/media/shapes-segment-001.png b/docs/media/shapes-segment-001.png
index ad1b575e..a479b4dd 100644
Binary files a/docs/media/shapes-segment-001.png and b/docs/media/shapes-segment-001.png differ
diff --git a/docs/media/text-001.jpg b/docs/media/text-001.jpg
index 63ca0315..21447b71 100644
Binary files a/docs/media/text-001.jpg and b/docs/media/text-001.jpg differ
diff --git a/docs/media/text-002.jpg b/docs/media/text-002.jpg
index 6cfb7c97..6d920a5e 100644
Binary files a/docs/media/text-002.jpg and b/docs/media/text-002.jpg differ
diff --git a/docs/media/text-003.jpg b/docs/media/text-003.jpg
index 720d17e2..d1e74b8a 100644
Binary files a/docs/media/text-003.jpg and b/docs/media/text-003.jpg differ
diff --git a/docs/media/text-004-thumb.jpg b/docs/media/text-004-thumb.jpg
index 65e12614..daeb44b2 100644
Binary files a/docs/media/text-004-thumb.jpg and b/docs/media/text-004-thumb.jpg differ
diff --git a/docs/media/text-004.jpg b/docs/media/text-004.jpg
new file mode 100644
index 00000000..bdac1967
Binary files /dev/null and b/docs/media/text-004.jpg differ
diff --git a/docs/media/text-004.mp4 b/docs/media/text-004.mp4
index 768c6ebf..a31cdb8f 100644
Binary files a/docs/media/text-004.mp4 and b/docs/media/text-004.mp4 differ
diff --git a/docs/media/text-005.jpg b/docs/media/text-005.jpg
new file mode 100644
index 00000000..166e05ac
Binary files /dev/null and b/docs/media/text-005.jpg differ
diff --git a/docs/media/ui-001.jpg b/docs/media/ui-001.jpg
index b1bc0f3b..44fb212a 100644
Binary files a/docs/media/ui-001.jpg and b/docs/media/ui-001.jpg differ
diff --git a/docs/media/ui-002.jpg b/docs/media/ui-002.jpg
index 58e2bd69..05756458 100644
Binary files a/docs/media/ui-002.jpg and b/docs/media/ui-002.jpg differ
diff --git a/docs/media/ui-006.jpg b/docs/media/ui-006.jpg
index b9170e80..582a581c 100644
Binary files a/docs/media/ui-006.jpg and b/docs/media/ui-006.jpg differ
diff --git a/docs/media/ui-007.jpg b/docs/media/ui-007.jpg
index f29644c7..70047f5e 100644
Binary files a/docs/media/ui-007.jpg and b/docs/media/ui-007.jpg differ
diff --git a/docs/media/ui-008.jpg b/docs/media/ui-008.jpg
index 67a8274b..9d856769 100644
Binary files a/docs/media/ui-008.jpg and b/docs/media/ui-008.jpg differ
diff --git a/docs/media/ui-009.jpg b/docs/media/ui-009.jpg
index ff7c4921..8021fbbc 100644
Binary files a/docs/media/ui-009.jpg and b/docs/media/ui-009.jpg differ
diff --git a/docs/programBasics/applicationProgram.markdown b/docs/programBasics/applicationProgram.markdown
index 7d69c059..bea07929 100644
--- a/docs/programBasics/applicationProgram.markdown
+++ b/docs/programBasics/applicationProgram.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/03_Program_basics/C100_ApplicationProgram.kt' instead.
+# Edit 'src/main/kotlin/docs/20_Program_basics/C100_ApplicationProgram.kt' instead.
 layout: default
 title: Application program
 parent: Program basics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -81,4 +81,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/03_Program_basics/C100_ApplicationProgram.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/20_Program_basics/C100_ApplicationProgram.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/programBasics/extensions.markdown b/docs/programBasics/extensions.markdown
index 7014bcc7..2a48f63f 100644
--- a/docs/programBasics/extensions.markdown
+++ b/docs/programBasics/extensions.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/03_Program_basics/C120_Extensions.kt' instead.
+# Edit 'src/main/kotlin/docs/20_Program_basics/C120_Extensions.kt' instead.
 layout: default
 title: Extensions
 parent: Program basics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 120
 has_children: false
 ---
@@ -76,4 +76,4 @@ Next to the built-in extensions there is [ORX](https://github.com/openrndr/orx),
 contributed OPENRNDR extensions and add-ons. If you work from `openrndr-template` you can easily add and remove extensions 
 from your project by editing the `orxFeatures` property in `build.gradle.kts`. 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/03_Program_basics/C120_Extensions.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/20_Program_basics/C120_Extensions.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/programBasics/index.markdown b/docs/programBasics/index.markdown
index 00780dfc..c0fe7b17 100644
--- a/docs/programBasics/index.markdown
+++ b/docs/programBasics/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/03_Program_basics/index.kt' instead.
+# Edit 'src/main/kotlin/docs/20_Program_basics/index.kt' instead.
 layout: default
 title: Program basics
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1030
 has_children: true
 ---
  
 # Program basics 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/03_Program_basics/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/20_Program_basics/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/programBasics/programConfiguration.markdown b/docs/programBasics/programConfiguration.markdown
index 730e76f1..0fc4fe4d 100644
--- a/docs/programBasics/programConfiguration.markdown
+++ b/docs/programBasics/programConfiguration.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/03_Program_basics/C110_ProgramConfiguration.kt' instead.
+# Edit 'src/main/kotlin/docs/20_Program_basics/C110_ProgramConfiguration.kt' instead.
 layout: default
 title: Program configuration
 parent: Program basics
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -64,4 +64,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/03_Program_basics/C110_ProgramConfiguration.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/20_Program_basics/C110_ProgramConfiguration.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/videos/index.markdown b/docs/videos/index.markdown
index 41134a8c..b4418b22 100644
--- a/docs/videos/index.markdown
+++ b/docs/videos/index.markdown
@@ -1,14 +1,14 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/09_Videos/index.kt' instead.
+# Edit 'src/main/kotlin/docs/60_Videos/index.kt' instead.
 layout: default
 title: Videos
 parent: ~
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 1090
 has_children: true
 ---
  
 # Videos 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/09_Videos/index.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/60_Videos/index.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/videos/playingVideos.markdown b/docs/videos/playingVideos.markdown
index fe094eb8..4269d048 100644
--- a/docs/videos/playingVideos.markdown
+++ b/docs/videos/playingVideos.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/09_Videos/C100_Playing_Videos.kt' instead.
+# Edit 'src/main/kotlin/docs/60_Videos/C100_Playing_Videos.kt' instead.
 layout: default
 title: Playing videos
 parent: Videos
-last_modified_at: 2023.06.13 22:47:00 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 100
 has_children: false
 ---
@@ -112,4 +112,4 @@ fun main() = application {
 }
 ``` 
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/09_Videos/C100_Playing_Videos.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/60_Videos/C100_Playing_Videos.kt){: .btn .btn-github }
\ No newline at end of file
diff --git a/docs/videos/writingToVideoFiles.markdown b/docs/videos/writingToVideoFiles.markdown
index 7fef16af..dd66d122 100644
--- a/docs/videos/writingToVideoFiles.markdown
+++ b/docs/videos/writingToVideoFiles.markdown
@@ -1,10 +1,10 @@
 ---
 # File generated by dokgen. Do not edit. 
-# Edit 'src/main/kotlin/docs/09_Videos/C110_Writing_to_video_files.kt' instead.
+# Edit 'src/main/kotlin/docs/60_Videos/C110_Writing_to_video_files.kt' instead.
 layout: default
 title: Writing to video files
 parent: Videos
-last_modified_at: 2023.07.24 16:41:35 +0200
+last_modified_at: 2024.01.15 12:27:05 +0100
 nav_order: 110
 has_children: false
 ---
@@ -111,4 +111,4 @@ are also available by enabling the
 extension.
      
 
-[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/09_Videos/C110_Writing_to_video_files.kt){: .btn .btn-github }
\ No newline at end of file
+[edit on GitHub](https://github.com/openrndr/openrndr-guide/blob/main/src/main/kotlin/docs/60_Videos/C110_Writing_to_video_files.kt){: .btn .btn-github }
\ No newline at end of file