diff --git a/apps/color-buddy/src/controls/SetColorSpace.svelte b/apps/color-buddy/src/controls/SetColorSpace.svelte
index e9abb51..4303892 100644
--- a/apps/color-buddy/src/controls/SetColorSpace.svelte
+++ b/apps/color-buddy/src/controls/SetColorSpace.svelte
@@ -3,7 +3,7 @@
 
   import configStore from "../stores/config-store";
 
-  import { colorPickerConfig } from "../lib/utils";
+  import { colorPickerConfig, titleCase } from "../lib/utils";
   import Tooltip from "../components/Tooltip.svelte";
   import Nav from "../components/Nav.svelte";
   import Check from "virtual:icons/fa6-solid/check";
@@ -12,18 +12,26 @@
   export let colorSpace: string;
   export let onChange: (e: any) => void;
   export let showDragPicker: boolean;
-  const notAllowed = new Set(["rgb"]);
-  $: basicOptions = Object.keys(colorPickerConfig)
-    .filter((x) => !notAllowed.has(x) && !colorPickerConfig[x].advancedSpace)
-    .sort((a, b) => {
-      if (a === "lab") return -1;
-      if (b === "lab") return 1;
-      return a.localeCompare(b);
-    });
-
-  $: advancedSpaceOptions = Object.keys(colorPickerConfig)
-    .filter((x) => !notAllowed.has(x) && colorPickerConfig[x].advancedSpace)
-    .filter((x) => x.toLowerCase() !== "srgb");
+  const notAllowed = new Set([
+    "rgb",
+    // "srgb",
+  ]);
+  $: spaceGroups = Object.keys(colorPickerConfig)
+    .filter((x) => !notAllowed.has(x.toLowerCase()))
+    .reduce(
+      (acc, x) => {
+        const group = colorPickerConfig[x].spaceType;
+        if (!acc[group]) acc[group] = [];
+        acc[group].push(x);
+        return acc;
+      },
+      {} as Record<string, string[]>
+    );
+  const groupOrder = [
+    "perceptually uniform",
+    "rgb based",
+    "other interesting spaces",
+  ];
 
   $: showBg = $configStore.showColorBackground;
   const showTypes = ["show on drag", "always show", "never show"] as Parameters<
@@ -34,66 +42,43 @@
 <div class="flex flex-col">
   <div class="whitespace-nowrap text-xs">Color space</div>
   <Tooltip>
-    <div slot="content" class="flex flex-col max-w-md" let:onClick>
-      <div class="text-xs">Basic color spaces</div>
-      {#each basicOptions as space}
-        <button
-          class={`${simpleTooltipRowStyle} py-1  flex items-top text-sm `}
-          on:click={() => {
-            onChange(space);
-            onClick();
-          }}
-        >
-          <Check
-            class="my-1 text-base mr-2 {space !== colorSpace
-              ? 'opacity-0'
-              : ''}"
-          />
-          <div class="flex flex-col">
-            <div class:font-bold={space === colorSpace}>
-              {space.toUpperCase()}
-              {space === "lab" ? "(default)" : ""}
-            </div>
-            <div class="text-xs">
-              {colorPickerConfig[space].description.split(".")[0]}
-            </div>
-            <div class="text-xs">
-              {colorPickerConfig[space].description.split(".")[1]}
-            </div>
-          </div>
-        </button>
-      {/each}
-      <div class="w-full border-b border-stone-200" />
-      <div class="mt-2 text-xs">Advanced color spaces</div>
-      <!-- <div class="">
-        These color spaces provide more control over the color representation,
-        but may be less intuitive or familiar
-      </div> -->
-      {#each advancedSpaceOptions as space}
-        <button
-          class={`${simpleTooltipRowStyle} py-1  flex  items-top text-sm`}
-          on:click={() => {
-            onChange(space);
-            onClick();
-          }}
-        >
-          <Check
-            class="my-1 text-base mr-2 {space !== colorSpace
-              ? 'opacity-0'
-              : ''}"
-          />
-          <div class="flex flex-col">
-            <div class:font-bold={space === colorSpace}>
-              {space.toUpperCase()}
-            </div>
-            <div class="text-xs">
-              {colorPickerConfig[space].description.split(".")[0]}
-            </div>
-            <div class="text-xs">
-              {colorPickerConfig[space].description.split(".")[1]}
+    <div
+      slot="content"
+      class="flex flex-col max-w-md max-h-lvh overflow-auto"
+      let:onClick
+    >
+      {#each groupOrder as groupName}
+        <div class="text-xs">
+          {titleCase(groupName)
+            .split(" ")
+            .map((x) => (x === "Rgb" ? "RGB" : x))
+            .join(" ")}
+        </div>
+        {#each spaceGroups[groupName] as space}
+          <button
+            class={`${simpleTooltipRowStyle} py-1  flex items-top text-sm `}
+            on:click={() => {
+              onChange(space);
+              onClick();
+            }}
+          >
+            <Check
+              class="my-1 text-base mr-2 {space !== colorSpace
+                ? 'opacity-0'
+                : ''}"
+            />
+            <div class="flex flex-col">
+              <div class:font-bold={space === colorSpace}>
+                {space.toUpperCase()}
+                {space === "lab" ? "(default)" : ""}
+              </div>
+              <div class="text-xs">
+                {colorPickerConfig[space].description}
+              </div>
             </div>
-          </div>
-        </button>
+          </button>
+        {/each}
+        <div class="w-full border-b border-stone-200 my-2" />
       {/each}
 
       {#if showDragPicker}
diff --git a/apps/color-buddy/src/lib/utils.ts b/apps/color-buddy/src/lib/utils.ts
index af77028..07e1f60 100644
--- a/apps/color-buddy/src/lib/utils.ts
+++ b/apps/color-buddy/src/lib/utils.ts
@@ -27,15 +27,14 @@ type ColorSpace = keyof typeof ColorSpaceDirectory;
 export const colorPickerConfig = Object.fromEntries(
   (Object.keys(ColorSpaceDirectory) as ColorSpace[]).map((name: ColorSpace) => {
     const space = (ColorSpaceDirectory as any)[name] as typeof Color;
-    const exampleColor = new (ColorSpaceDirectory as any)[name]() as Color;
     const { x, y, z } = space.dimensionToChannel;
     return [
       name,
       {
-        advancedSpace: space.advancedSpace,
         axisLabel: space.axisLabel,
         description: space.description,
         isPolar: space.isPolar,
+        spaceType: space.spaceType,
         title: space.name,
         xChannel: x,
         xChannelIndex: space.channelNames.indexOf(x),
diff --git a/apps/color-buddy/src/scatterplot/ColorScatterPlotPolarGuide.svelte b/apps/color-buddy/src/scatterplot/ColorScatterPlotPolarGuide.svelte
index 4d49610..ab74dea 100644
--- a/apps/color-buddy/src/scatterplot/ColorScatterPlotPolarGuide.svelte
+++ b/apps/color-buddy/src/scatterplot/ColorScatterPlotPolarGuide.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { Color } from "color-buddy-palette";
+  import { Color, cvdSim } from "color-buddy-palette";
   import { colorPickerConfig } from "../lib/utils";
   import { arc } from "d3-shape";
 
@@ -7,6 +7,7 @@
   import colorStore from "../stores/color-store";
   import configStore from "../stores/config-store";
   import { scaleLinear } from "d3-scale";
+
   export let rScale: any;
   export let yScale: any;
   export let xScale: any;
@@ -17,6 +18,8 @@
   export let axisColor: string;
   export const textColor: string = "";
 
+  $: currentSim = $configStore.colorSim;
+
   $: config = colorPickerConfig[colorSpace as keyof typeof colorPickerConfig];
   $: rNonDimScale = scaleLinear().domain([0, 1]).range(rScale.domain());
   $: focusedColors = $focusStore.focusedColors;
@@ -67,7 +70,12 @@
     coords[zIdx] = focusedColors.length
       ? colors[focusedColors[0]].toChannels()[zIdx]
       : midPoint;
-    return Color.colorFromChannels(coords, colorSpace as any).toDisplay();
+    const newColor = Color.colorFromChannels(coords, colorSpace as any);
+    if (currentSim !== "none") {
+      return cvdSim(currentSim, newColor).toDisplay();
+    } else {
+      return newColor.toDisplay();
+    }
   };
   $: arcScale = arc();
   $: angleScale = scaleLinear()
diff --git a/apps/color-buddy/src/scatterplot/ColorScatterPlotXYGuides.svelte b/apps/color-buddy/src/scatterplot/ColorScatterPlotXYGuides.svelte
index c1404b1..63f33bf 100644
--- a/apps/color-buddy/src/scatterplot/ColorScatterPlotXYGuides.svelte
+++ b/apps/color-buddy/src/scatterplot/ColorScatterPlotXYGuides.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
-  import { Color } from "color-buddy-palette";
+  import { Color, cvdSim } from "color-buddy-palette";
   import { colorPickerConfig } from "../lib/utils";
   import focusStore from "../stores/focus-store";
   import colorStore from "../stores/color-store";
   import configStore from "../stores/config-store";
   import { scaleLinear } from "d3-scale";
+
   export let xScale: any;
   export let yScale: any;
   export let plotHeight: number;
@@ -14,6 +15,8 @@
   export let axisColor: string;
   export let textColor: string;
 
+  $: currentSim = $configStore.colorSim;
+
   $: config = colorPickerConfig[colorSpace as keyof typeof colorPickerConfig];
   $: xNonDimScale = scaleLinear().domain([0, 1]).range(xScale.domain());
   $: yNonDimScale = scaleLinear().domain([0, 1]).range(yScale.domain());
@@ -66,7 +69,12 @@
     const avgZChannel = avgNums(fColors.map((x) => x[config.zChannelIndex]));
     const midPoint = (config.zDomain[0] + config.zDomain[1]) / 2;
     coords[config.zChannelIndex] = fColors.length ? avgZChannel : midPoint;
-    return Color.colorFromChannels(coords, colorSpace as any).toDisplay();
+    const newColor = Color.colorFromChannels(coords, colorSpace as any);
+    if (currentSim !== "none") {
+      return cvdSim(currentSim, newColor).toDisplay();
+    } else {
+      return newColor.toDisplay();
+    }
   };
   $: shouldShowColorBackground =
     $configStore.showColorBackground === "always show" ||
diff --git a/packages/palette/src/Color.ts b/packages/palette/src/Color.ts
index 67fc289..5c0ae80 100644
--- a/packages/palette/src/Color.ts
+++ b/packages/palette/src/Color.ts
@@ -11,6 +11,7 @@ type DistAlgorithm = "76" | "CMC" | "2000" | "ITP" | "Jz" | "OK";
 const ColorIOCaches = new Map<string, ColorIO>();
 const InGamutCache = new Map<string, boolean>();
 const colorStateCache = new Map<string, number>();
+
 /**
  * The base class for all color spaces
  *
@@ -24,7 +25,7 @@ export class Color {
   static stepSize: Channels = [1, 1, 1];
   static channelNames: string[] = [];
   static description: string = "";
-  static advancedSpace = true;
+  static spaceType: string = "rgb based";
   static dimensionToChannel: Record<"x" | "y" | "z", string> = {
     x: "",
     y: "",
@@ -271,8 +272,8 @@ class CIELAB extends Color {
   static stepSize: Channels = [1, 1, 1];
   static dimensionToChannel = { x: "a", y: "b", z: "L" };
   static description =
-    "Lightness, Red-green (a), and Yellow-blue (b). Perceptually uniform.";
-  static advancedSpace = false;
+    "Lightness, Red-green (a), and Yellow-blue (b). International standard";
+  static spaceType = "perceptually uniform";
   static axisLabel = (num: number) => `${Math.round(num)}`;
 
   toString(): string {
@@ -293,7 +294,7 @@ class HSV extends Color {
   spaceName = "hsv" as const;
   static dimensionToChannel = { x: "s", y: "h", z: "v" };
   static description = "Hue, Saturation, Value. Cylindrical";
-  static advancedSpace = false;
+  static spaceType = "rgb based";
   toString(): string {
     const [h, s, v] = this.stringChannels();
     return `color(hsv ${h} ${s} ${v})`;
@@ -313,6 +314,7 @@ class RGB extends Color {
   static stepSize: Channels = [1, 1, 1];
   static dimensionToChannel = { x: "g", y: "b", z: "r" };
   static description = "Red, Green, Blue.";
+  static spaceType = "rgb based";
   static axisLabel = (num: number) => `${Math.round(num)}`;
   toString(): string {
     const [r, g, b] = this.stringChannels();
@@ -329,10 +331,12 @@ class SRGB extends Color {
   static channelNames = ["r", "g", "b"];
   channels = { r: 0, g: 0, b: 0 };
   spaceName = "srgb" as const;
-  static domains = { r: [0, 1], g: [0, 1], b: [0, 1] } as Domain;
+  static domains = { r: [1, 0], g: [0, 1], b: [1, 0] } as Domain;
   static stepSize: Channels = [0.01, 0.01, 0.01];
   static dimensionToChannel = { x: "g", y: "b", z: "r" };
-  static description = "Red, Green, Blue.";
+  static description =
+    "Red, Green, Blue. Designed for display, but not palette design";
+  static spaceType = "rgb based";
   static axisLabel = (num: number) => `${Math.round(num)}`;
   toString(): string {
     const [r, g, b] = this.stringChannels();
@@ -353,7 +357,7 @@ class HSL extends Color {
   static stepSize: Channels = [1, 1, 1];
   static dimensionToChannel = { x: "s", y: "h", z: "l" };
   static description = "Hue, Saturation, Lightness. Cylindrical";
-  static advancedSpace = false;
+  static spaceType = "rgb based";
   static isPolar = true;
 
   toString(): string {
@@ -373,8 +377,8 @@ class LCH extends Color {
   static domains = { l: [100, 0], c: [0, 120], h: [360, 0] } as Domain;
   static stepSize: Channels = [1, 1, 1];
   static dimensionToChannel = { x: "c", y: "h", z: "l" };
-  static description = "Luminance, Chroma, Hue. Cylindrical";
-  static advancedSpace = false;
+  static description = "Luminance, Chroma, Hue. Cylindrical, refinement of LAB";
+  static spaceType = "perceptually uniform";
   static isPolar = true;
   static axisLabel = (num: number) => `${Math.round(num)}`;
 }
@@ -411,7 +415,8 @@ class OKLCH extends Color {
   static domains = { l: [1, 0], c: [0, 0.4], h: [360, 0] } as Domain;
   static stepSize: Channels = [0.01, 0.01, 1];
   static dimensionToChannel = { x: "c", y: "h", z: "l" };
-  static description = "Luminance, Chroma, Hue. Cylindrical (based on LCH)";
+  static description = "Luminance, Chroma, Hue. Cylindrical";
+  static spaceType = "perceptually uniform";
   static isPolar = true;
 }
 
@@ -424,8 +429,9 @@ class JZAZBZ extends Color {
   static stepSize: Channels = [0.01, 0.01, 0.01];
   static dimensionToChannel = { x: "az", y: "bz", z: "jz" };
   static description =
-    "Lightness (JZ), Red-green (az), Blue-yellow (bz). Perceptually uniform (based on LAB)";
+    "Lightness (JZ), Red-green (az), Blue-yellow (bz). Designed for HD imagery";
 
+  static spaceType = "other interesting spaces";
   toString(): string {
     const [jz, az, bz] = Object.values(this.channels).map((x) =>
       isNaN(x) ? 0 : x
@@ -450,7 +456,7 @@ class XYZ extends Color {
   static dimensionToChannel = { x: "x", y: "z", z: "y" };
   static description =
     "X (Curves), Y (Luminance), Z (Blue). International Standard";
-
+  static spaceType = "other interesting spaces";
   toString(): string {
     const [x, y, z] = Object.values(this.channels).map((x) =>
       isNaN(x) ? 0 : x
@@ -474,6 +480,7 @@ class HCT extends Color {
   static dimensionToChannel = { x: "c", y: "h", z: "t" };
   static isPolar = true;
   static description = "Hue, Chroma, Tone. Perceptually uniform (from Google)";
+  static spaceType = "other interesting spaces";
 
   toString(): string {
     const [h, c, t] = Object.values(this.channels).map((x) =>
@@ -495,8 +502,9 @@ class CAM16 extends Color {
   static stepSize: Channels = [1, 1, 1];
   static dimensionToChannel = { x: "m", y: "h", z: "j" };
   static description =
-    "J (lightness), M (colorfulness), H (hue). Perceptually uniform";
+    "J (lightness), M (colorfulness), H (hue). Designed for color management";
   static isPolar = true;
+  static spaceType = "other interesting spaces";
 
   toString(): string {
     const [h, c, t] = Object.values(this.channels).map((x) =>
@@ -515,10 +523,8 @@ function colorFromString(
   colorSpace: keyof typeof ColorSpaceDirectory = "lab",
   allowError?: boolean
 ): Color {
-  const result = new ColorSpaceDirectory[colorSpace]().fromString(
-    colorString,
-    allowError
-  );
+  const result = new (ColorSpaceDirectory[colorSpace] ||
+    ColorSpaceDirectory.lab)().fromString(colorString, allowError);
   return result;
 }
 
@@ -531,9 +537,8 @@ function colorFromHex(
     return colorHexCache.get(hex)!.copy() as Color;
   }
   const color = new ColorIO(hex).to(colorSpace);
-  const outColor = new ColorSpaceDirectory[colorSpace]().fromChannels(
-    color.coords
-  );
+  const outColor = new (ColorSpaceDirectory[colorSpace] ||
+    ColorSpaceDirectory.lab)().fromChannels(color.coords);
   colorHexCache.set(hex, outColor);
   return outColor;
 }
@@ -547,7 +552,8 @@ function colorFromChannels(
   if (colorChannelsCache.has(cacheKey)) {
     return colorChannelsCache.get(cacheKey)!.copy() as Color;
   }
-  const color = new ColorSpaceDirectory[colorSpace]().fromChannels(channels);
+  const color = new (ColorSpaceDirectory[colorSpace] ||
+    ColorSpaceDirectory.lab)().fromChannels(channels);
   colorChannelsCache.set(cacheKey, color);
   return color;
 }
@@ -562,7 +568,8 @@ function toColorSpace(
   const space = colorSpace === "rgb" ? "srgb" : colorSpace;
   const channels = color.toColorIO().to(space, { inGamut: true }).coords;
 
-  const newColor = new ColorSpaceDirectory[colorSpace]().fromChannels(channels);
+  const newColor = new (ColorSpaceDirectory[colorSpace] ||
+    ColorSpaceDirectory.lab)().fromChannels(channels);
   newColor.tags = color.tags;
   return newColor;
 }
@@ -572,7 +579,7 @@ export const ColorSpaceDirectory = {
   hct: HCT,
   hsl: HSL,
   hsv: HSV,
-  jzazbz: JZAZBZ,
+  // jzazbz: JZAZBZ,
   lab: CIELAB,
   lch: LCH,
   // oklab: OKLAB,