diff --git a/docs/components/Labels.vue b/docs/components/Labels.vue
index 6a36269..d39c10b 100644
--- a/docs/components/Labels.vue
+++ b/docs/components/Labels.vue
@@ -4,6 +4,8 @@ import { ref } from "vue";
 
 const imgSrc = ref("");
 const labelSrc = ref("");
+const colorBy = ref("colorpicker");  // or "auto" or "data"
+const labelsColor = ref("#00ffff");
 const colName = ref("Centroids_RAW_X");
 const lutName = ref("green_fire_blue.lut");
 const luts = ref([]);
@@ -23,17 +25,36 @@ const ROW_DATA = [[1442865, "8179A86D76", 1, 26.317552776815774, 33.152220936829
 
 
 async function renderLabel() {
-  console.log("fillColor", fillColor.value);
-  // const colName = "Centroids_RAW_X";
-  const colIndex = COL_NAMES.indexOf(colName.value);
-  const keyIndex = COL_NAMES.indexOf("Cell_ID");
-  const minValue = ROW_DATA.reduce((min, row) => Math.min(min, row[colIndex]), Infinity);
-  const maxValue = ROW_DATA.reduce((max, row) => Math.max(max, row[colIndex]), -Infinity);
+  console.log("colorBy", colorBy.value);
 
-  // 256 rgb values
+  // always render the lut preview...
   const lut = omezarr.getLutRgb(lutName.value);
   let newLut = luts.value.find((lut) => lut.name === lutName.value);
   lutImgSrc.value = newLut ? newLut.png : null;
+  
+  let transparent = [0,0,0,0];
+  if (colorBy.value === "colorpicker") {
+    const r = parseInt(labelsColor.value.slice(1, 3), 16);
+    const g = parseInt(labelsColor.value.slice(3, 5), 16);
+    const b = parseInt(labelsColor.value.slice(5, 7), 16);
+    let cpLut = [transparent, [r, g, b]];
+    labelImage.setChannelLut(0, cpLut);
+    labelSrc.value = await labelImage.render({ targetSize: 300 });
+    return;
+  }
+  
+  if (colorBy.value === "auto") {
+    let glasbeyRgb = omezarr.getLutRgb("glasbey.lut").slice(0, 50);
+    let lutWithBackground = [transparent, ...glasbeyRgb];
+    labelImage.setChannelLut(0, lutWithBackground);
+    labelSrc.value = await labelImage.render({ targetSize: 300 });
+    return;
+  }
+
+  const colIndex = COL_NAMES.indexOf(colName.value);
+  const keyIndex = COL_NAMES.indexOf("Cell_ID");
+  const minValue = ROW_DATA.reduce((min, row) => Math.min(min, row[colIndex]), Infinity);
+  const maxValue = ROW_DATA.reduce((max, row) => Math.max(max, row[colIndex]), -Infinity);
 
   // crate a rendering Map of Cell_ID to RGBA color based on the Centroids_RAW_X value
   const renderingMap = new Map();
@@ -56,6 +77,7 @@ async function renderLabel() {
   displayMin.value = minValue;
   displayMax.value = maxValue;
 
+  labelImage.setChannelLut(0, undefined); // reset any previous LUT
   labelImage.setChannelColorMap(0, renderingMap);
 
   // render...
@@ -74,7 +96,7 @@ onMounted(async () => {
   imgSrc.value = await img.render({ targetSize: 300 });
 
   let labelPaths = await img.getLabelsPaths();
-  labelImage = await omezarr.NgffImage.load(
+  labelImage = await omezarr.LabelsImage.load(
     url + "labels/" + labelPaths[0]
   );
   labelImage.setChannelActive(0, true);
@@ -83,32 +105,59 @@ onMounted(async () => {
 </script>
 
 <template>
-  <select v-model="colName" @change="renderLabel">
-    <option v-for="label in COL_NAMES.slice(3)" :key="label" :value="label">
-      {{ label }}
-    </option>
-  </select>
-
-  <select v-model="lutName" @change="renderLabel">
-    <option v-for="lut in luts" :key="lut.name" :value="lut.name">
-      {{lut.name}}
-    </option>
-  </select>
-
-  <div style="display: flex; flex-direction: row; gap: 7px; align-items: center; margin: 0 10px">
-    <input type="checkbox" v-model="fillColorEnabled" @change="renderLabel" />
-      Fill color:
-    </input>
-    <input type="color" v-model="fillColor" @input="renderLabel" />
+  <!-- radio buttons for colorBy attribute -->
+  Color labels by:
+  <hr>
+  <div>
+    <input type="radio" v-model="colorBy" id="colorpicker" name="color_by" value="colorpicker" @change="renderLabel"/>
+    <label for="colorpicker">Single color:</label>
+    <input title="Color picker" type="color" v-model="labelsColor" @input="renderLabel" style="position: relative; top: 4px; margin-left: 10px;" />
+    <code :class="$style.code">img.setChannelLut(0, [transparent, cyan]);</code>
+  </div> 
+  <hr>
+  <div>
+    <input type="radio" v-model="colorBy" id="auto" name="color_by" value="auto" @change="renderLabel"/>
+    <label for="auto">Glasbey LUT</label>
+    <code :class="$style.code">img.setChannelLut(0, [transparent, ...glasbeyRgb]);</code>
+  </div>
+  <hr>
+  <div>
+    <input type="radio" v-model="colorBy" id="data" name="color_by" value="data" @change="renderLabel"/>
+    <label for="data">ColorMap:</label>
+    <code :class="$style.code">img.setChannelColorMap(0, colorMap);</code>
   </div>
 
-  <div style="display: flex; flex-direction: row; gap: 7px; align-items: center; margin: 0 10px">
-    <!-- Show a colorbar with min and max values -->
-    <div>{{ displayMin.toFixed(2) }}</div>
-    <img :class="$style.lutImg" :src="lutImgSrc"/>
-    <div>{{ displayMax.toFixed(2) }}</div>
+  <!-- show 50% opacity unless colorBy is 'data' -->
+  <div style="margin-left: 100px" :style="{ opacity: colorBy === 'data' ? 1 : 0.5 }">
+    <select v-model="colName" @change="renderLabel" :disabled="colorBy !== 'data'">
+      <option v-for="label in COL_NAMES.slice(3)" :key="label" :value="label">
+        {{ label }}
+      </option>
+    </select>
+
+    <select v-model="lutName" @change="renderLabel" :disabled="colorBy !== 'data'">
+      <option v-for="lut in luts" :key="lut.name" :value="lut.name">
+        {{lut.name}}
+      </option>
+    </select>
+
+    <div style="display: flex; flex-direction: row; gap: 7px; align-items: center; margin: 0 10px">
+      <input type="checkbox" v-model="fillColorEnabled" @change="renderLabel" :disabled="colorBy !== 'data'" />
+        Fill color:
+      </input>
+      <input type="color" v-model="fillColor" @input="renderLabel" :disabled="colorBy !== 'data'" />
+    </div>
+
+    <div style="display: flex; flex-direction: row; gap: 7px; align-items: center; margin: 0 10px">
+      <!-- Show a colorbar with min and max values -->
+      <div>{{ displayMin.toFixed(2) }}</div>
+      <img :class="$style.lutImg" :src="lutImgSrc"/>
+      <div>{{ displayMax.toFixed(2) }}</div>
+    </div>
   </div>
 
+  <hr/>
+
   <a
     :href="
       VURL +
@@ -137,6 +186,9 @@ select {
   border-radius: 5px;
   appearance: auto;
 }
+.code {
+  margin-left: 30px;
+}
 .lutImg {
   width: 256px;
   height: 20px;
diff --git a/docs/labels.md b/docs/labels.md
index a681df6..2bdf502 100644
--- a/docs/labels.md
+++ b/docs/labels.md
@@ -3,9 +3,9 @@
 
 We can use `ngffImage.getLabelsPaths()` to list any labels groups below a multiscales image.
 
-These can then be opened as images and rendered as normal.
-
-Here we use `ngffImage.setChannelColorMap(0, colorMap)` to map label values to `r,g,b` colors.
+These groups can then be opened as images and rendered as normal. Here we use a
+`LabelsImage` which will map pixel values directly to LUT indices when rendering LUTs (instead
+of scaling by start/end values as for a regular Image).
 
 ```js
 // load and render the parent image
@@ -16,22 +16,61 @@ document.getElementById("img").src = labelSrc;
 
 // find labels and open the first label image
 let labelPaths = await img.getLabelsPaths();
-let labelImage = await omezarr.NgffImage.load(url + "labels/" + labelPaths[0]);
+let labelImage = await omezarr.LabelsImage.load(url + "labels/" + labelPaths[0]);
+```
+
+## LUTs
+
+We can render by `LUTs` (lookup-tables) which are lists of colors; each color is
+defined by `[red, green, blue]`, or `[red, green, blue, alpha]` values.
+
+When a `LabelsImage` renders with a `LUT`, the first item of the `LUT` list will be used for background (where `pixel value = 0`).
+The remaining colors will be used for other label values, repeating as necessary.
+
+```js
+// for the "Color Picker" option (in the demo below) we only need to specify the background
+// and a single additional color for all the labels:
+let transparent = [0, 0, 0, 0];
+let cyan = [0, 255, 255];
+let lut = [transparent, cyan];
+
+// OR, for the "Auto" option, we can use the "glasbey" LUT...
+const glasbeyRgb = omezarr.getLutRgb("glasbey.lut");
+// ...and add the first value as transparent
+let lut = [transparent, ...glasbeyRgb];
 
+// In either case, we can apply the LUT to channel 0 and render:
+labelImage.setChannelLut(0, lut);
+let labelSrc = await labelImage.render({ targetSize: 300 });
+document.getElementById("labelImg").src = labelSrc;
+```
+
+## Color Map
+
+If we want to precisely map pixel values to colors, we can use a `colorMap`, which is
+a `Map` of `integer: [r, g, b]` (or `[r, g, b, a]`).
+
+If we have a table of data, with a row for each label, we can build a `colorMap` for
+a chosen table column, e.g. `Centroids_RAW_X`.
+
+```js
 // Using a LUT (list of [r, g, b] values)...
 const lut = omezarr.getLutRgb("green_fire_blue.lut");
 // and a table of data for each label value, we can 
 // create a colorMap for rendering the labels...
 const colorMap = new Map();
-ROW_DATA.forEach((row) => {
+TABLE_DATA.forEach((row) => {
     const labelValue = row["Label_Value"];
     const paramValue = row["Centroids_RAW_X"];
+    // minValue and maxValue are determined for the chosen column (not shown)
     const fraction = (paramValue - minValue) / (maxValue - minValue);
     const lutIndex = Math.round(fraction * (lut.length - 1));
     const rgb = lut[lutIndex];
     colorMap.set(labelValue, rgb);
 });
 // We can use omezarr.FILL_VALUE_KEY to specify fillColor (transparent by default)
+// This will be used for background (since 0 is not in our colorMap) and for any
+// other label values that are missing from our colorMap
 if (enableFill) {
     colorMap.set(omezarr.FILL_VALUE_KEY, fillRGBA);
 }
diff --git a/index.html b/index.html
index 0cf62be..76b15cb 100644
--- a/index.html
+++ b/index.html
@@ -166,32 +166,37 @@ <h2>Look-up tables available to choose</h2>
         document.getElementById("labels").innerHTML += html;
 
         let labelPaths = await img.getLabelsPaths();
-        let labelImage = await omezarr.NgffImage.load(imgUrl + "labels/" + labelPaths[0]);
-        labelImage.setChannelActive(0, true);
+        // we use `LabelsImage` since it won't scale values when rendering...
+        let labelImage = await omezarr.LabelsImage.load(imgUrl + "labels/" + labelPaths[0]);
 
         let glasbeyInvertedMap = new Map();
-        // We only want to see labels 50-60
-        for (let i = 20; i < 90; i++) {
-          glasbeyInvertedMap.set(i, omezarr.luts.GLASBEY_INVERTED[i]);
+        // We only want to see first 100 labels
+        for (let i = 1; i < 101; i++) {
+          // label 1 is first color LUT[0], label 2 is LUT[1] etc. (label 0 is background)
+          glasbeyInvertedMap.set(i, omezarr.luts.GLASBEY_INVERTED[i - 1]);
         }
         // set label 0 (background) to grey with some transparency
-        glasbeyInvertedMap.set(0, [100, 100, 100, 255]);
+        glasbeyInvertedMap.set(0, [100, 100, 100, 100]);
         // set missing values to Yellow
         glasbeyInvertedMap.set(omezarr.FILL_VALUE_KEY, [255, 255, 0, 100]);
         labelImage.setChannelColorMap(0, glasbeyInvertedMap);
+        let labelSrc = await labelImage.render({targetSize: 512});
+        html = `<a href="${imgUrl}labels/${labelPaths[0]}"><img class="checquers" src="${labelSrc}" /></a>`;
+        document.getElementById("labels").innerHTML += html;
 
-        // let labelSrc = await omezarr.createRgbDataUrl(labelRgba.data, labelRgba.width);
-        let labelSrc = await labelImage.render({targetSize: 300});
+        // transparent (background), then glasbey_inverted for labels
+        // We use just 100 colors from the LUT; values over 100 are moduloed back to the start of the LUT
+        // the FIRST 100 labels will be identical to the colorMap example above...
+        labelImage.setChannelLut(0, [[255, 0, 0, 0], ...omezarr.luts.GLASBEY_INVERTED.slice(0, 100)]);
+        labelSrc = await labelImage.render({targetSize: 512});
         html = `<a href="${imgUrl}labels/${labelPaths[0]}"><img class="checquers" src="${labelSrc}" /></a>`;
         document.getElementById("labels").innerHTML += html;
 
-        let overlayHtml = `<div style="position: relative; display: inline-block;">
-          <a href="${imgUrl}">
-            <img src="${imsSrc}" />
-            <img src="${labelSrc}" class="fadeInOut" style="position: absolute; top: 0; left: 0;" />
-          </a>
-        </div>`;
-        document.getElementById("labels").innerHTML += overlayHtml;
+        // Alternatively, we can set ALL labels to the same color:
+        labelImage.setChannelLut(0, [[255, 0, 0, 0], [0, 255, 255]]);
+        labelSrc = await labelImage.render({targetSize: 512});
+        html = `<a href="${imgUrl}labels/${labelPaths[0]}"><img class="checquers" src="${labelSrc}" /></a>`;
+        document.getElementById("labels").innerHTML += html;
       }
 
       import * as zarr from "https://cdn.jsdelivr.net/npm/zarrita@next/+esm";
diff --git a/package-lock.json b/package-lock.json
index eb9211e..c4ac38b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,15 +1,15 @@
 {
   "name": "ome-zarr.js",
-  "version": "0.0.17",
+  "version": "0.0.19",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ome-zarr.js",
-      "version": "0.0.17",
+      "version": "0.0.19",
       "license": "BSD",
       "dependencies": {
-        "zarrita": "^0.5.0"
+        "zarrita": "^0.7.3"
       },
       "devDependencies": {
         "@types/node": "^24.10.0",
@@ -2091,12 +2091,13 @@
       }
     },
     "node_modules/@zarrita/storage": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/@zarrita/storage/-/storage-0.1.3.tgz",
-      "integrity": "sha512-ZyCMYN3LuCNtKxro9876r/KyHyXV+ie2Bhk1qYsJR4Jp+sAjoVRRNNSJPsJxk64ZgFFezayO5S2hCu88/1Odwg==",
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@zarrita/storage/-/storage-0.2.0.tgz",
+      "integrity": "sha512-855ZXqtnds7spnT8vNvD+MXa3QExP1m2GqShe8yt7uZXHnQLgJHgkpVwFjE1B0KDDRO0ki09hmk6OboTaIfPsQ==",
+      "license": "MIT",
       "dependencies": {
         "reference-spec-reader": "^0.2.0",
-        "unzipit": "^1.4.3"
+        "unzipit": "2.0.0"
       }
     },
     "node_modules/acorn": {
@@ -2493,9 +2494,10 @@
       }
     },
     "node_modules/fflate": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
-      "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A=="
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.3.tgz",
+      "integrity": "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==",
+      "license": "MIT"
     },
     "node_modules/focus-trap": {
       "version": "7.6.6",
@@ -3045,6 +3047,7 @@
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/numcodecs/-/numcodecs-0.3.2.tgz",
       "integrity": "sha512-6YSPnmZgg0P87jnNhi3s+FVLOcIn3y+1CTIgUulA3IdASzK9fJM87sUFkpyA+be9GibGRaST2wCgkD+6U+fWKw==",
+      "license": "MIT",
       "dependencies": {
         "fflate": "^0.8.0"
       }
@@ -3258,7 +3261,8 @@
     "node_modules/reference-spec-reader": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/reference-spec-reader/-/reference-spec-reader-0.2.0.tgz",
-      "integrity": "sha512-q0mfCi5yZSSHXpCyxjgQeaORq3tvDsxDyzaadA/5+AbAUwRyRuuTh0aRQuE/vAOt/qzzxidJ5iDeu1cLHaNBlQ=="
+      "integrity": "sha512-q0mfCi5yZSSHXpCyxjgQeaORq3tvDsxDyzaadA/5+AbAUwRyRuuTh0aRQuE/vAOt/qzzxidJ5iDeu1cLHaNBlQ==",
+      "license": "MIT"
     },
     "node_modules/regex": {
       "version": "6.0.1",
@@ -3708,14 +3712,12 @@
       }
     },
     "node_modules/unzipit": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/unzipit/-/unzipit-1.4.3.tgz",
-      "integrity": "sha512-gsq2PdJIWWGhx5kcdWStvNWit9FVdTewm4SEG7gFskWs+XCVaULt9+BwuoBtJiRE8eo3L1IPAOrbByNLtLtIlg==",
-      "dependencies": {
-        "uzip-module": "^1.0.2"
-      },
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unzipit/-/unzipit-2.0.0.tgz",
+      "integrity": "sha512-DVeVIWUZCAQPNzm5sB0hpsG1GygTTdBnzNtYYEpInkttx5evkyqRgZi6rTczoySqp8hO5jHVKzrH0f23X8FZLg==",
+      "license": "MIT",
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/uri-js": {
@@ -3727,11 +3729,6 @@
         "punycode": "^2.1.0"
       }
     },
-    "node_modules/uzip-module": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/uzip-module/-/uzip-module-1.0.3.tgz",
-      "integrity": "sha512-AMqwWZaknLM77G+VPYNZLEruMGWGzyigPK3/Whg99B3S6vGHuqsyl5ZrOv1UUF3paGK1U6PM0cnayioaryg/fA=="
-    },
     "node_modules/vfile": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
@@ -4520,11 +4517,12 @@
       "dev": true
     },
     "node_modules/zarrita": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/zarrita/-/zarrita-0.5.4.tgz",
-      "integrity": "sha512-i88iN2+HqIQ+uiCEWLfhjbYNXAJD7IrM4h3lFwFclfqEOOhxp10amRWtqmgN5jbuy3+h0LwdyLVVzk4y9rTLgg==",
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/zarrita/-/zarrita-0.7.3.tgz",
+      "integrity": "sha512-wChTQ1Ox75INoQCzKAfLWAfB70JJ4KjdW8Sz5x4ZWrFB4Dw+YZdnxHTL0xSdsrB9EmKSeK7fS1Y+I2ibhfGbkw==",
+      "license": "MIT",
       "dependencies": {
-        "@zarrita/storage": "^0.1.3",
+        "@zarrita/storage": "^0.2.0",
         "numcodecs": "^0.3.2"
       }
     },
@@ -5925,12 +5923,12 @@
       }
     },
     "@zarrita/storage": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/@zarrita/storage/-/storage-0.1.3.tgz",
-      "integrity": "sha512-ZyCMYN3LuCNtKxro9876r/KyHyXV+ie2Bhk1qYsJR4Jp+sAjoVRRNNSJPsJxk64ZgFFezayO5S2hCu88/1Odwg==",
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@zarrita/storage/-/storage-0.2.0.tgz",
+      "integrity": "sha512-855ZXqtnds7spnT8vNvD+MXa3QExP1m2GqShe8yt7uZXHnQLgJHgkpVwFjE1B0KDDRO0ki09hmk6OboTaIfPsQ==",
       "requires": {
         "reference-spec-reader": "^0.2.0",
-        "unzipit": "^1.4.3"
+        "unzipit": "2.0.0"
       }
     },
     "acorn": {
@@ -6222,9 +6220,9 @@
       "requires": {}
     },
     "fflate": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
-      "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A=="
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.3.tgz",
+      "integrity": "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA=="
     },
     "focus-trap": {
       "version": "7.6.6",
@@ -7096,12 +7094,9 @@
       "dev": true
     },
     "unzipit": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/unzipit/-/unzipit-1.4.3.tgz",
-      "integrity": "sha512-gsq2PdJIWWGhx5kcdWStvNWit9FVdTewm4SEG7gFskWs+XCVaULt9+BwuoBtJiRE8eo3L1IPAOrbByNLtLtIlg==",
-      "requires": {
-        "uzip-module": "^1.0.2"
-      }
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unzipit/-/unzipit-2.0.0.tgz",
+      "integrity": "sha512-DVeVIWUZCAQPNzm5sB0hpsG1GygTTdBnzNtYYEpInkttx5evkyqRgZi6rTczoySqp8hO5jHVKzrH0f23X8FZLg=="
     },
     "uri-js": {
       "version": "4.4.1",
@@ -7112,11 +7107,6 @@
         "punycode": "^2.1.0"
       }
     },
-    "uzip-module": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/uzip-module/-/uzip-module-1.0.3.tgz",
-      "integrity": "sha512-AMqwWZaknLM77G+VPYNZLEruMGWGzyigPK3/Whg99B3S6vGHuqsyl5ZrOv1UUF3paGK1U6PM0cnayioaryg/fA=="
-    },
     "vfile": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
@@ -7472,11 +7462,11 @@
       "dev": true
     },
     "zarrita": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/zarrita/-/zarrita-0.5.4.tgz",
-      "integrity": "sha512-i88iN2+HqIQ+uiCEWLfhjbYNXAJD7IrM4h3lFwFclfqEOOhxp10amRWtqmgN5jbuy3+h0LwdyLVVzk4y9rTLgg==",
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/zarrita/-/zarrita-0.7.3.tgz",
+      "integrity": "sha512-wChTQ1Ox75INoQCzKAfLWAfB70JJ4KjdW8Sz5x4ZWrFB4Dw+YZdnxHTL0xSdsrB9EmKSeK7fS1Y+I2ibhfGbkw==",
       "requires": {
-        "@zarrita/storage": "^0.1.3",
+        "@zarrita/storage": "^0.2.0",
         "numcodecs": "^0.3.2"
       }
     },
diff --git a/package.json b/package.json
index c2d7a86..767cdfc 100644
--- a/package.json
+++ b/package.json
@@ -54,6 +54,6 @@
   },
   "packageManager": "pnpm@9.4.0+sha512.f549b8a52c9d2b8536762f99c0722205efc5af913e77835dbccc3b0b0b2ca9e7dc8022b78062c17291c48e88749c70ce88eb5a74f1fa8c4bf5e18bb46c8bd83a",
   "dependencies": {
-    "zarrita": "^0.5.0"
+    "zarrita": "^0.7.3"
   }
 }
diff --git a/src/api.ts b/src/api.ts
index 9026ebf..aca0519 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -81,7 +81,8 @@ export async function renderImage(
     axes,
     channels,
     sliceIndices,
-    autoBoost
+    autoBoost,
+    {calcMinMaxForRange: true}
   );
   return createRgbDataUrl(data, width);
 }
diff --git a/src/image.ts b/src/image.ts
index da695b5..31a1bb9 100644
--- a/src/image.ts
+++ b/src/image.ts
@@ -57,6 +57,8 @@ export class NgffImage {
     }
     this.multiscales = this.imgAttrs.multiscales;
     this.omero = this.imgAttrs.omero;
+    // default to calculating min/max for range if not provided in channels info
+    this.calcMinMaxForRange = true;
 
     // for convenience, we also add top-level keys for the most commonly used fields
     this.paths = this.multiscales[0].datasets.map((d) => d.path);
@@ -95,7 +97,8 @@ export class NgffImage {
       attrs = group.attrs as OmeAttrs;
     }
     
-    const img = new NgffImage(attrs, store);
+    // create an instance of the static class...
+    const img = new this(attrs, store);
 
     // open first array (or specified datasetIndex); populates `omero` if missing.
     const datasetIndex = options.datasetIndex ?? 0;
@@ -139,9 +142,13 @@ export class NgffImage {
     omero.channels[channelIndex].inverted = inverted;
   }
 
-  setChannelLut(channelIndex: number, lut: Color[]) {
+  setChannelLut(channelIndex: number, lut: Color[] | undefined) {
     let omero = this.checkChannelIndex(channelIndex);
-    omero.channels[channelIndex].lut = lut;
+    if (lut == undefined) {
+      delete omero.channels[channelIndex].lut;
+    } else {
+      omero.channels[channelIndex].lut = lut;
+    }
   }
 
   setChannelColorMap(channelIndex: number, colorMap: Map<number, Color>) {
@@ -375,6 +382,7 @@ export class NgffImage {
     channels?: Channel[],
     maxSize?: number,
     signal?: AbortSignal,
+    calcMinMaxForRange?: boolean,
   } = {}
   ): Promise<{
     data: Uint8ClampedArray;
@@ -436,13 +444,21 @@ export class NgffImage {
     }
     let channels = options.channels || this.omero?.channels;
 
+    // By default for NgffImage, start/end values will be calculated from the data (min/max)
+    // (if not specified in channels)
+    // Default is false for LabelsImage since we want to use values directly as indices into the LUT.
+    let calcMinMaxForRange = this.calcMinMaxForRange ?? true;
+    if (options?.calcMinMaxForRange != undefined) {
+      calcMinMaxForRange = options.calcMinMaxForRange;
+    }
+
     let { data, width, height } = await renderRgba(
       arr,
       this.axes,
       channels,
       slices,
       Boolean(options.autoBoost),
-      { signal: options.signal }
+      { signal: options.signal, calcMinMaxForRange: Boolean(calcMinMaxForRange) }
     );
 
     return { data, width, height };
@@ -458,10 +474,42 @@ export class NgffImage {
     channels?: Channel[],
     maxSize?: number,
     signal?: AbortSignal,
+    calcMinMaxForRange?: boolean
   } = {}
   ): Promise<string> {
-
     let { data, width } = await this.renderRgba(options);
     return createRgbDataUrl(data, width);
   }
 }
+
+
+export class LabelsImage extends NgffImage {
+
+  constructor(attrs: OmeAttrs, store: zarr.Group<zarr.Readable> | zarr.Readable) {
+    super(attrs, store);
+    // for labels, we default to NOT calculating min/max for range, since we want values to be used directly as indices into the LUT
+    this.calcMinMaxForRange = false;
+  }
+
+  static async load(store: zarr.Group<zarr.Readable> | zarr.Readable | string,
+    options: {
+      datasetIndex?: number,
+      attrs?: OmeAttrs,
+      signal?: AbortSignal
+    } = {}
+  ): Promise<NgffImage> {
+    let img = await super.load(store, options);
+
+    // Need to remove start/end values from channels, so they aren't used for scaling values when rendering...
+    if (img.omero && img.omero.channels) {
+      for (let ch of img.omero.channels) {
+        console.log("BEFORE", ch.window);
+        if (ch.window) {
+          delete ch.window.start;
+          delete ch.window.end;
+        }
+      }
+    }
+    return img;
+  }
+}
diff --git a/src/index.ts b/src/index.ts
index 9308e8a..c55fb18 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -20,7 +20,7 @@ export {
   FILL_VALUE_KEY,
 } from "./utils";
 export { LUTS, getLuts, getLutRgb } from "./luts";
-export { NgffImage } from "./image";
+export { NgffImage, LabelsImage } from "./image";
 export { renderThumbnail, renderImage, render } from "./api";
 export {
   renderChunk,
diff --git a/src/render.ts b/src/render.ts
index d586547..557ded8 100644
--- a/src/render.ts
+++ b/src/render.ts
@@ -70,17 +70,30 @@ export function renderChunkWithLUT(
   // LUT is an array of [r,g,b] or [r,g,b,a] colors, from "darkest" to "brightest"
   // The intensity value from the chunk is mapped to a color in the LUT, scaling
   // over the min/max range if provided.
-  // In no range is provided, chunk values are used directly as indices into the LUT.
-  // Values outside the range are clamped to the first/last value in the LUT.
+  // If no range is provided, chunk values are used directly as indices into the LUT.
+  // Values less than 0 are clamped to the first value in the LUT.
+  // Values greater than the length of the LUT are "modulo" the LUT length,
+  // so the LUT will repeat, excluding the FIRST value which is reserved for 0 values.
+  // e.g. if LUT has 256 values, and chunk value is 257, it will use LUT[1].
   const bins = lut.length;
-  const { dst, blending = "additive", range = [0, bins - 1] } = options ?? {};
+  const { dst, blending = "additive" } = options ?? {};
 
-  function transferFunc(value: number): Color {
-    const [min, max] = range;
-    if (value < min) value = min;
-    if (value > max) value = max;
-    value = Math.round(((bins - 1) * (value - min)) / (max - min));
-    return lut[value];
+  let transferFunc: (value: number) => Color;
+  if (options?.range) {
+    const range = options.range;
+    transferFunc = function(value: number): Color {
+      const [min, max] = range;
+      if (value < min) value = min;
+      if (value > max) value = max;
+      value = Math.round(((bins - 1) * (value - min)) / (max - min));
+      return lut[value];
+    }
+  } else {
+    transferFunc = function(value: number): Color {
+      if (value <= 0) return lut[0];
+      const index = ((value - 1) % (bins - 1)) + 1;
+      return lut[index];
+    }
   }
 
   return renderChunk(chunk, transferFunc, { dst, blending });
@@ -117,13 +130,13 @@ export async function renderRgba(
   channels: Channel[] | null | undefined,
   sliceIndices: { [k: string]: number | [number, number] | undefined },
   autoBoost: boolean,
-  options?: { signal?: AbortSignal }
+  options?: { signal?: AbortSignal, calcMinMaxForRange?: boolean }
 ): Promise<{
   data: Uint8ClampedArray;
   width: number;
   height: number;
 }> {
-  const { signal } = options ?? {};
+  const { signal, calcMinMaxForRange } = options ?? {};
   signal?.throwIfAborted();
 
   let shape = arr.shape;
@@ -157,7 +170,7 @@ export async function renderRgba(
     });
     rgbColors = channels.map((ch) => hexToRGB(ch.color));
     lutsOrColorMaps = channels.map((ch) =>
-      "lut" in ch ? (ch.lut as Color[]) : "colorMap" in ch ? (ch.colorMap as Map<number, Color>) : undefined
+      ("lut" in ch && ch.lut) ? (ch.lut as Color[]) : "colorMap" in ch ? (ch.colorMap as Map<number, Color>) : undefined
     );
   } else {
     visibilities = getDefaultVisibilities(channel_count);
@@ -194,8 +207,8 @@ export async function renderRgba(
   signal?.throwIfAborted();
 
   // Use start/end values from 'omero' if available, otherwise calculate min/max
-  let minMaxValues = activeChannelIndices.map(
-    (chIndex: number, i: number): [number, number] => {
+  let ranges = activeChannelIndices.map(
+    (chIndex: number, i: number): [number, number] | undefined => {
       if (channels && channels[chIndex]) {
         let chOmero = channels[chIndex];
         if (
@@ -205,13 +218,16 @@ export async function renderRgba(
           return [chOmero.window.start, chOmero.window.end];
         }
       }
-      return getMinMaxValues(ndChunks[i]);
+      if (calcMinMaxForRange) {
+        return getMinMaxValues(ndChunks[i]);
+      }
+      return undefined;
     }
   );
 
   let data = renderChunks(
     ndChunks,
-    minMaxValues,
+    ranges,
     rgbColors,
     lutsOrColorMaps,
     inverteds,
@@ -225,14 +241,15 @@ export async function renderRgba(
 
 export function renderChunks(
   ndChunks: any,
-  minMaxValues: Array<[number, number]>,
+  ranges: Array<[number, number] | undefined>,
   colors: Array<[number, number, number]>,
   lutsOrColorMaps: Array<Color[] | Map<number, Color> | undefined> | undefined,
   inverteds: Array<boolean> | undefined,
   autoBoost: boolean = false
 ): Uint8ClampedArray {
-  // Render the given chunks (one per channel) to an RGBA array, using the provided colors and min/max values for each channel.
+  // Render the given chunks (one per channel) to an RGBA array, using the provided colors and ranges for each channel.
   // If lutsOrColorMaps are provided, they are used instead of the colors.
+  // NB: If any ranges are undefined, the pixel values are used as indices into the LUT (or LUT created from the color).
   // A LUT is an array of [r,g,b] or [r,g,b,a] colors, from "darkest" to "brightest". Range is scaled over the min/max values
   // for the channel, and values outside the range are clamped to the first/last value in the LUT.
   // A colormap is a Map of value -> [r,g,b] or [r,g,b,a].
@@ -240,6 +257,7 @@ export function renderChunks(
 
   let masterLutsMaps = colors.map((color, i) => {
     let lutOrMap = lutsOrColorMaps?.length ? lutsOrColorMaps[i] : undefined;
+    // If no LUT or colormap is provided, create a default LUT based on the channel color
     if (!lutOrMap) {
       lutOrMap = Array.from({ length: 256 }, (_, i) => [color[0] * i/255, color[1] * i/255, color[2] * i/255, 255]);
     }
@@ -258,7 +276,7 @@ export function renderChunks(
     let fillValue: Color | undefined = colorMap.get(FILL_VALUE_KEY);
     rgba = renderChunkWithColormap(ndChunks[0], colorMap as Map<number, Color>, { fillValue });
   } else {
-    rgba = renderChunkWithLUT(ndChunks[0], masterLutsMaps[0] as Color[], { range: minMaxValues[0] });
+    rgba = renderChunkWithLUT(ndChunks[0], masterLutsMaps[0] as Color[], { range: ranges[0] });
   }
   for (let i = 1; i < ndChunks.length; i++) {
     if (masterLutsMaps[i] instanceof Map) {
@@ -267,7 +285,7 @@ export function renderChunks(
       let channelRgba = renderChunkWithColormap(ndChunks[i], colorMap, { blending: "additive", dst: rgba, fillValue });
       rgba = channelRgba;
     } else {
-      let channelRgba = renderChunkWithLUT(ndChunks[i], masterLutsMaps[i] as Color[], { blending: "additive", dst: rgba, range: minMaxValues[i] });
+      let channelRgba = renderChunkWithLUT(ndChunks[i], masterLutsMaps[i] as Color[], { blending: "additive", dst: rgba, range: ranges[i] });
       rgba = channelRgba;
     }
   }
diff --git a/tests/renderChunks.node.test.js b/tests/renderChunks.node.test.js
new file mode 100644
index 0000000..fae5ad6
--- /dev/null
+++ b/tests/renderChunks.node.test.js
@@ -0,0 +1,130 @@
+
+import { describe, expect, test } from "vitest";
+import {
+    renderChunk,
+    renderChunkWithLUT,
+    renderChunkWithColormap,
+    renderChunks } from "../src/render.ts";
+import { FILL_VALUE_KEY } from "../src/utils.ts";
+
+
+test("renderChunks", async () => {
+
+    let fakeChunk = {shape: [2, 3], data: [0, 1, 2, 3, 4, 5]};
+    let colors = [[255, 0, 0], [0, 255, 0], [0, 0, 255]];
+    let rendered = renderChunks(
+        [fakeChunk, fakeChunk, fakeChunk],
+        [[0, 3], [0, 6], [0, 9]], // ranges
+        colors
+    );
+
+    let expected = new Uint8ClampedArray([
+        0, 0, 0, 255,
+       85, 43, 28, 255,
+      170, 85, 57, 255,
+      255, 128, 85, 255,
+      255, 170, 113, 255,
+      255, 213, 142, 255,
+    ]);
+    expect(rendered).toStrictEqual(expected);
+});
+
+
+test("renderChunk", async () => {
+
+    let fakeChunk = {shape: [2, 2], data: [0, 1, 2, 3]};
+    let fn = (value) => ([value * 2, 0, 0])
+    let rendered = renderChunk(fakeChunk, fn);
+
+    let expected = new Uint8ClampedArray([
+        0, 0, 0, 255,
+        2, 0, 0, 255,
+        4, 0, 0, 255,
+        6, 0, 0, 255,
+    ]);
+    expect(rendered).toStrictEqual(expected);
+});
+
+
+test("renderChunkWithLUT", async () => {
+
+    let fakeChunk = {shape: [3, 3], data: [0, 1, 2, 3, 4, 5, 6, 7, 8]};
+    let transparent = [0, 0, 0, 0];
+    let red = [255, 0, 0];
+    let green = [0, 255, 0];
+    let blue = [0, 0, 255];
+    let lut = [transparent, red, green, blue]
+
+    // without range, values are indices into the LUT, wrapping around to 1
+    let rendered = renderChunkWithLUT(fakeChunk, lut);
+
+    let expected = new Uint8ClampedArray([
+        0,0,0,0,
+        255,0,0,255,  //red
+        0,255,0,255,  //green
+        0,0,255,255,  //blue
+        255,0,0,255,  //red
+        0,255,0,255,  //green
+        0,0,255,255,  // etc...
+        255,0,0,255,
+        0,255,0,255,
+    ]);
+    expect(rendered).toStrictEqual(expected);
+});
+
+
+test("renderChunkWithLUTrange", async () => {
+    
+    let fakeChunk = {shape: [3, 3], data: [0, 1, 2, 3, 4, 5, 6, 7, 8]};
+    let lut = Array.from({length: 256}, (_, i) => [i, 0, 0, 255]); // red gradient
+
+    // with range, values are scaled to the LUT range
+    let rendered = renderChunkWithLUT(fakeChunk, lut, {range: [0, 8]});
+
+    let expected = new Uint8ClampedArray([
+        0,    0,   0, 255,
+        32,   0,   0, 255,
+        64,   0,   0, 255,
+        96,   0,   0, 255,
+       128,   0,   0, 255,
+       159,   0,   0, 255,
+       191,   0,   0, 255,
+       223,   0,   0, 255,
+       255,   0,   0, 255
+    ]);
+    expect(rendered).toStrictEqual(expected);
+});
+
+
+test("renderChunkWithColormap", async () => {
+
+    let fakeChunk = {shape: [2, 3], data: [0, 1, 2, 3, 4, 5]};
+    let colorMap = new Map();
+    colorMap.set(0, [0, 0, 0, 255]);
+    colorMap.set(1, [255, 0, 0, 255]);
+    colorMap.set(2, [0, 255, 0, 255]);
+
+    // default fill value is [0, 0, 0, 0]
+    let rendered = renderChunkWithColormap(fakeChunk, colorMap);
+    let expected = new Uint8ClampedArray([
+        0,    0,   0, 255,
+       255,   0,   0, 255,
+         0, 255,   0, 255,
+         0,   0,   0,   0,  // default fill value
+         0,   0,   0,   0,
+         0,   0,   0,   0,
+    ]);
+    expect(rendered).toStrictEqual(expected);
+
+    // custom fill value
+    rendered = renderChunkWithColormap(fakeChunk, colorMap, {fillValue: [255, 255, 255, 255]});
+    expected = new Uint8ClampedArray([
+        0,    0,   0, 255,
+       255,   0,   0, 255,
+         0, 255,   0, 255,
+         255, 255, 255, 255,  // new fill value
+         255, 255, 255, 255,
+         255, 255, 255, 255,
+    ]);
+    expect(rendered).toStrictEqual(expected);
+});