diff --git a/src/layer/annotation/index.ts b/src/layer/annotation/index.ts
index 35c1a4e43..76d4375e5 100644
--- a/src/layer/annotation/index.ts
+++ b/src/layer/annotation/index.ts
@@ -15,6 +15,8 @@
  */
 
 import "#src/layer/annotation/style.css";
+import svgClosedEye from "ikonate/icons/eye-closed.svg?raw";
+import svgOpenedEye from "ikonate/icons/eye.svg?raw";
 
 import type { AnnotationDisplayState } from "#src/annotation/annotation_layer_state.js";
 import { AnnotationLayerState } from "#src/annotation/annotation_layer_state.js";
@@ -69,6 +71,7 @@ import {
 import { NullarySignal } from "#src/util/signal.js";
 import { DependentViewWidget } from "#src/widget/dependent_view_widget.js";
 import { makeHelpButton } from "#src/widget/help_button.js";
+import { makeIcon } from "#src/widget/icon.js";
 import { LayerReferenceWidget } from "#src/widget/layer_reference.js";
 import { makeMaximizeButton } from "#src/widget/maximize_button.js";
 import { RenderScaleWidget } from "#src/widget/render_scale_widget.js";
@@ -783,6 +786,28 @@ class RenderingOptionsTab extends Tab {
     label.style.flex = "1";
     label.textContent = "Annotation shader:";
     topRow.appendChild(label);
+
+    const managedLayer = this.layer.managedLayer;
+    const codeVisible = managedLayer.codeVisible;
+    this.codeWidget.element.style.display = managedLayer.codeVisible ? "block" : "none";
+    this.codeWidget.setVisible(codeVisible);
+    const codeVisibilityControl = makeIcon({
+      title: codeVisible ? "Hide code": "Show code",
+      svg: codeVisible ? svgOpenedEye : svgClosedEye,
+      onClick: () => {
+        const button = codeVisibilityControl as HTMLDivElement;
+        managedLayer.setCodeVisible(!managedLayer.codeVisible)
+        if (managedLayer.codeVisible) {
+          button.title = "Hide code";
+          button.innerHTML = svgOpenedEye
+        } else {
+          button.title = "Show code";
+          button.innerHTML = svgClosedEye
+        }
+        this.codeWidget.setVisible(managedLayer.codeVisible);
+    }});
+    topRow.appendChild(codeVisibilityControl);
+
     topRow.appendChild(
       makeMaximizeButton({
         title: "Show larger editor view",
diff --git a/src/layer/image/index.ts b/src/layer/image/index.ts
index 1bc7f048e..5a338a10b 100644
--- a/src/layer/image/index.ts
+++ b/src/layer/image/index.ts
@@ -545,36 +545,26 @@ class RenderingOptionsTab extends Tab {
     topRow.appendChild(spacer);
 
     const managedLayer = this.layer.managedLayer;
+    const codeVisible = managedLayer.codeVisible;
+    this.codeWidget.element.style.display = managedLayer.codeVisible ? "block" : "none";
+    this.codeWidget.setVisible(codeVisible);
     const codeVisibilityControl = makeIcon({
-      title: managedLayer.codeVisible ? "Hide code": "Show code",
-      svg: managedLayer.codeVisible ? svgOpenedEye : svgClosedEye,
+      title: codeVisible ? "Hide code": "Show code",
+      svg: codeVisible ? svgOpenedEye : svgClosedEye,
       onClick: () => {
         const button = codeVisibilityControl as HTMLDivElement;
         managedLayer.setCodeVisible(!managedLayer.codeVisible)
         if (managedLayer.codeVisible) {
           button.title = "Hide code";
           button.innerHTML = svgOpenedEye
-          this.codeWidget.element.style.display = "block";
         } else {
           button.title = "Show code";
           button.innerHTML = svgClosedEye
-          this.codeWidget.element.style.display = "none";
         }
+        this.codeWidget.setVisible(managedLayer.codeVisible);
     }});
-    // managedLayer.layerChanged.add(() => {
-    //   const button = codeVisibilityControl as HTMLDivElement;
-    //   if (managedLayer.codeVisible) {
-    //     button.title = "Hide code";
-    //     button.innerHTML = svgOpenedEye
-    //     this.codeWidget.element.style.display = "block";
-    //   } else {
-    //     button.title = "Show code";
-    //     button.innerHTML = svgClosedEye
-    //     this.codeWidget.element.style.display = "none";
-    //   }
-    // });
-
     topRow.appendChild(codeVisibilityControl);
+
     topRow.appendChild(
       makeMaximizeButton({
         title: "Show larger editor view",
@@ -597,7 +587,6 @@ class RenderingOptionsTab extends Tab {
       ).element,
     );
 
-    this.codeWidget.element.style.display = managedLayer.codeVisible ? "block" : "none";
     element.appendChild(this.codeWidget.element);
     element.appendChild(
       this.registerDisposer(
diff --git a/src/widget/shader_code_widget.ts b/src/widget/shader_code_widget.ts
index c86fae81c..e6e3d0401 100644
--- a/src/widget/shader_code_widget.ts
+++ b/src/widget/shader_code_widget.ts
@@ -189,4 +189,12 @@ export class ShaderCodeWidget extends RefCounted {
     this.textEditor = <any>undefined;
     super.disposed();
   }
+
+  setVisible(visible: boolean) {
+    this.element.style.display = visible ? "block" : "none";
+  }
+
+  isVisible() {
+    return this.element.style.display === "block";
+  }
 }