diff --git a/ide/qml/DocumentPadding.qml b/ide/qml/DocumentPadding.qml
new file mode 100644
index 0000000..3c47413
--- /dev/null
+++ b/ide/qml/DocumentPadding.qml
@@ -0,0 +1,9 @@
+import QtQuick 2.0
+import QtQuick.Layouts 1.3
+
+ColumnLayout {
+    Layout.topMargin: 10
+    Layout.bottomMargin: 10
+    Layout.leftMargin: 12
+    Layout.rightMargin: 12
+}
diff --git a/ide/qml/NotebookCell.qml b/ide/qml/NotebookCell.qml
index 3466d05..f51ffaa 100644
--- a/ide/qml/NotebookCell.qml
+++ b/ide/qml/NotebookCell.qml
@@ -3,15 +3,19 @@
 import QtQuick.Controls.Material 2.0
 import QtQuick.Layouts 1.0
 
+import sh.swisschili.REFAL 1.0
+
 Item {
     id: root
 
     required property string code
     required property string result
+    property int status: Cell.IDLE
 
     signal insertBelowClicked()
     signal codeEditingFinished(string code)
     signal cellFocused()
+    signal runClicked()
 
     height: column.height
 
@@ -34,9 +38,18 @@
 
             RoundButton {
                 Layout.alignment: Qt.AlignTop
-                icon.source: "qrc:///icons/play-circle.svg"
+                icon.source: iconForState(root.state)
                 icon.color: Material.color(Material.Grey, Material.Shade600)
                 flat: true
+
+                onClicked: root.runClicked()
+
+                function iconForState(state) {
+                    if (state === Cell.RUNNING)
+                        return "qrc:///icons/square.svg"
+
+                    return "qrc:///icons/play-circle.svg"
+                }
             }
 
             ColumnLayout {
diff --git a/ide/qml/main.qml b/ide/qml/main.qml
index a28d47d..bf99a8d 100644
--- a/ide/qml/main.qml
+++ b/ide/qml/main.qml
@@ -63,22 +63,47 @@
                 model: notebook.cellModel
                 clip: true
 
+                header: ColumnLayout {
+                    width: codeEditor.width
+
+                    DocumentPadding {
+                        Layout.bottomMargin: 0
+
+                        Label {
+                            font.pointSize: 18
+                            text: "Notebook"
+                        }
+                    }
+
+                    InsertRow {
+                        onInsertClicked: notebook.cellModel.insertRows(notebook.cellModel.index(0, 0), 1);
+                    }
+                }
+
                 delegate: NotebookCell {
                     id: notebookCell
 
                     required property var model
                     required property var index
+                    required property var uuid
+                    required property int status
 
                     width: codeEditor.width - 5
 
                     code: model.code
-                    result: model.result
+                    result: model.result.trim()
+                    status: model.status
 
                     onCodeEditingFinished: model.code = code
 
                     onInsertBelowClicked: {
-                        console.info(index)
-                        cellModel.insertRows(cellModel.index(0, index), 1)
+                        console.info(index);
+                        notebook.cellModel.insertRows(notebook.cellModel.index(index + 1, 0), 1);
+                    }
+
+                    onRunClicked: {
+                        console.info("Cell run clicked")
+                        notebook.runCell(uuid)
                     }
                 }
             }