diff --git a/dotscape b/dotscape
index 711e429..336a45e 100755
Binary files a/dotscape and b/dotscape differ
diff --git a/functional-core/app/app-init.sml b/functional-core/app/app-init.sml
index 7ef0ce3..bef517c 100644
--- a/functional-core/app/app-init.sml
+++ b/functional-core/app/app-init.sml
@@ -41,6 +41,7 @@ struct
       , r = 0.0
       , g = 0.0
       , b = 0.0
+      , num = 0
       }
     end
 
diff --git a/functional-core/app/app-type.sml b/functional-core/app/app-type.sml
index 86fe218..2ee4eb4 100644
--- a/functional-core/app/app-type.sml
+++ b/functional-core/app/app-type.sml
@@ -44,6 +44,7 @@ sig
     , r: Real32.real
     , g: Real32.real
     , b: Real32.real
+    , num: int
     }
 end
 
@@ -101,5 +102,6 @@ struct
     , r: Real32.real
     , g: Real32.real
     , b: Real32.real
+    , num: int
     }
 end
diff --git a/functional-core/app/app-with.sml b/functional-core/app/app-with.sml
index a644257..53b84ce 100644
--- a/functional-core/app/app-with.sml
+++ b/functional-core/app/app-with.sml
@@ -60,6 +60,11 @@ sig
 
   val useTrianglesAndSetNormalMode: AppType.app_type * AppType.triangle list
                                     -> AppType.app_type
+
+  val num: AppType.app_type * int -> AppType.app_type
+  val r: AppType.app_type -> AppType.app_type
+  val g: AppType.app_type -> AppType.app_type
+  val b: AppType.app_type -> AppType.app_type
 end
 
 structure AppWith :> APP_WITH =
@@ -93,6 +98,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val newUndo = newUndoHd :: undo
@@ -118,6 +124,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -147,6 +154,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val newTriangle =
@@ -184,6 +192,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -211,6 +220,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -234,6 +244,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -261,6 +272,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -284,6 +296,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -313,6 +326,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val xClickPoints = ClickPoints.generate (wStart, wFinish, numClickPoints)
@@ -339,6 +353,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -389,6 +404,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -412,6 +428,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -440,6 +457,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val newUndo =
@@ -470,6 +488,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -498,6 +517,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val newUndo = newUndoHd :: undo
@@ -527,6 +547,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -554,6 +575,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -577,6 +599,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -604,6 +627,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = newMode
@@ -627,6 +651,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -654,6 +679,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
 
       val triangleStage = NO_TRIANGLE
@@ -679,6 +705,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -706,6 +733,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -729,6 +757,7 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
       }
     end
 
@@ -756,6 +785,7 @@ struct
         , r
         , g
         , b
+        , num
         } = app
     in
       { mode = mode
@@ -779,6 +809,222 @@ struct
       , r = r
       , g = g
       , b = b
+      , num = num
+      }
+    end
+
+  fun num (app: app_type, newNum): app_type =
+    let
+      val
+        { triangleStage
+        , mode
+        , triangles
+        , numClickPoints
+        , xClickPoints
+        , yClickPoints
+        , windowWidth
+        , windowHeight
+        , undo
+        , redo
+        , showGraph
+        , mouseX
+        , mouseY
+        , arrowX
+        , arrowY
+        , openFilePath
+        , fileBrowser
+        , fileBrowserIdx
+        , r
+        , g
+        , b
+        , num = _
+        } = app
+
+    in
+      { triangleStage = triangleStage
+      , undo = undo
+      , redo = []
+      , mode = mode
+      , triangles = triangles
+      , numClickPoints = numClickPoints
+      , xClickPoints = xClickPoints
+      , yClickPoints = yClickPoints
+      , windowWidth = windowWidth
+      , windowHeight = windowHeight
+      , showGraph = showGraph
+      , mouseX = mouseX
+      , mouseY = mouseY
+      , arrowX = arrowX
+      , arrowY = arrowY
+      , openFilePath = openFilePath
+      , fileBrowser = fileBrowser
+      , fileBrowserIdx = fileBrowserIdx
+      , r = r
+      , g = g
+      , b = b
+      , num = newNum
+      }
+    end
+
+  fun r (app: app_type): app_type =
+    let
+      val
+        { triangleStage
+        , mode
+        , triangles
+        , numClickPoints
+        , xClickPoints
+        , yClickPoints
+        , windowWidth
+        , windowHeight
+        , undo
+        , redo
+        , showGraph
+        , mouseX
+        , mouseY
+        , arrowX
+        , arrowY
+        , openFilePath
+        , fileBrowser
+        , fileBrowserIdx
+        , r = _
+        , g
+        , b
+        , num
+        } = app
+
+      val newR = Real32.fromInt num / 255.0
+    in
+      { triangleStage = triangleStage
+      , undo = undo
+      , redo = []
+      , mode = mode
+      , triangles = triangles
+      , numClickPoints = numClickPoints
+      , xClickPoints = xClickPoints
+      , yClickPoints = yClickPoints
+      , windowWidth = windowWidth
+      , windowHeight = windowHeight
+      , showGraph = showGraph
+      , mouseX = mouseX
+      , mouseY = mouseY
+      , arrowX = arrowX
+      , arrowY = arrowY
+      , openFilePath = openFilePath
+      , fileBrowser = fileBrowser
+      , fileBrowserIdx = fileBrowserIdx
+      , r = newR
+      , g = g
+      , b = b
+      , num = 0
+      }
+    end
+
+  fun g (app: app_type): app_type =
+    let
+      val
+        { triangleStage
+        , mode
+        , triangles
+        , numClickPoints
+        , xClickPoints
+        , yClickPoints
+        , windowWidth
+        , windowHeight
+        , undo
+        , redo
+        , showGraph
+        , mouseX
+        , mouseY
+        , arrowX
+        , arrowY
+        , openFilePath
+        , fileBrowser
+        , fileBrowserIdx
+        , r
+        , g = _
+        , b
+        , num
+        } = app
+
+      val newG = Real32.fromInt num / 255.0
+    in
+      { triangleStage = triangleStage
+      , undo = undo
+      , redo = []
+      , mode = mode
+      , triangles = triangles
+      , numClickPoints = numClickPoints
+      , xClickPoints = xClickPoints
+      , yClickPoints = yClickPoints
+      , windowWidth = windowWidth
+      , windowHeight = windowHeight
+      , showGraph = showGraph
+      , mouseX = mouseX
+      , mouseY = mouseY
+      , arrowX = arrowX
+      , arrowY = arrowY
+      , openFilePath = openFilePath
+      , fileBrowser = fileBrowser
+      , fileBrowserIdx = fileBrowserIdx
+      , r = r
+      , g = newG
+      , b = b
+      , num = 0
+      }
+    end
+
+  fun b (app: app_type): app_type =
+    let
+      val
+        { triangleStage
+        , mode
+        , triangles
+        , numClickPoints
+        , xClickPoints
+        , yClickPoints
+        , windowWidth
+        , windowHeight
+        , undo
+        , redo
+        , showGraph
+        , mouseX
+        , mouseY
+        , arrowX
+        , arrowY
+        , openFilePath
+        , fileBrowser
+        , fileBrowserIdx
+        , r
+        , g
+        , b = _
+        , num
+        } = app
+
+      val newB = Real32.fromInt num / 255.0
+    in
+      { triangleStage = triangleStage
+      , undo = undo
+      , redo = []
+      , mode = mode
+      , triangles = triangles
+      , numClickPoints = numClickPoints
+      , xClickPoints = xClickPoints
+      , yClickPoints = yClickPoints
+      , windowWidth = windowWidth
+      , windowHeight = windowHeight
+      , showGraph = showGraph
+      , mouseX = mouseX
+      , mouseY = mouseY
+      , arrowX = arrowX
+      , arrowY = arrowY
+      , openFilePath = openFilePath
+      , fileBrowser = fileBrowser
+      , fileBrowserIdx = fileBrowserIdx
+      , r = r
+      , g = g
+      , b = newB
+      , num = 0
       }
     end
 end
diff --git a/message-types/input-msg.sml b/message-types/input-msg.sml
index a872938..f6d15fb 100644
--- a/message-types/input-msg.sml
+++ b/message-types/input-msg.sml
@@ -15,6 +15,7 @@ sig
   | KEY_CTRL_L
   | KEY_CTRL_E
   | KEY_CTRL_O
+  | NUM of int
   | ARROW_UP
   | ARROW_LEFT
   | ARROW_RIGHT
@@ -43,6 +44,7 @@ struct
   | KEY_CTRL_L
   | KEY_CTRL_E
   | KEY_CTRL_O
+  | NUM of int
   | ARROW_UP
   | ARROW_LEFT
   | ARROW_RIGHT