diff --git a/light9/fade/Light9FadeUi.ts b/light9/fade/Light9FadeUi.ts
--- a/light9/fade/Light9FadeUi.ts
+++ b/light9/fade/Light9FadeUi.ts
@@ -36,6 +36,9 @@ export class Light9FadeUi extends LitEle
       .mappedToHw {
         background: #393945;
       }
+      #gm light9-fader {
+        width: 300px;
+      }
     `,
   ];
   render() {
@@ -43,7 +46,9 @@ export class Light9FadeUi extends LitEle
       <rdfdb-synced-graph></rdfdb-synced-graph>
 
       <h1>Fade</h1>
-
+<div id="gm">
+  <light9-fader .value=${this.grandMaster} @change=${this.gmChanged}></light9-fader>grand master
+</div>
       ${(this.fadePages?.pages || []).map(this.renderPage.bind(this))}
 
       <div><button @click=${this.addPage}>Add new page</button></div>
@@ -70,12 +75,14 @@ export class Light9FadeUi extends LitEle
 
   @property() fadePages?: FadePages;
   @property() currentHwPage?: NamedNode;
+  @property() grandMaster?: number;
 
   constructor() {
     super();
     getTopGraph().then((g) => {
       this.graph = g;
       this.graph.runHandler(this.compile.bind(this), `faders layout`);
+      this.graph.runHandler(this.compileGm.bind(this), `faders gm`);
     });
   }
   connectedCallback(): void {
@@ -109,6 +116,27 @@ export class Light9FadeUi extends LitEle
       this.currentHwPage = this.graph.uriValue(mc, U(":outputs"));
     } catch (e) { }
   }
+  compileGm() {
+    const U = this.graph.U();
+    this.grandMaster = undefined
+    let newVal
+    try {
+
+      newVal = this.graph.floatValue(U(':grandMaster'), U(':value'))
+    } catch (e) {
+      return
+    }
+    this.grandMaster = newVal;
+
+  }
+  gmChanged(ev: CustomEvent) {
+    const U = this.graph.U();
+    const newVal = ev.detail.value
+    // this.grandMaster = newVal;
+    this.graph.patchObject(U(':grandMaster'), U(':value'), this.graph.LiteralRoundedFloat(newVal), this.ctx)
+
+  }
+
 
   mapThisToHw(page: NamedNode) {
     const U = this.graph.U();