@imgly/codesign-mcp 0.1.5 → 0.1.6

package/assets/docs/guide/colors/for-print/spot.md

@@ -1,4 +1,4 @@
-> This is one page of the CE.SDK Vanilla JS/TS documentation. For a complete overview, see the [Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
+> This is one page of the CE.SDK Node.js documentation. For a complete overview, see the [Node.js Documentation Index](https://img.ly/docs/cesdk/node.md). For all docs in one file, see [llms-full.txt](./llms-full.txt.md).
 
 **Navigation:** [Guides](./guides.md) > [Colors](./colors.md) > [For Print](./colors/for-print.md) > [Spot Colors](./colors/for-print/spot.md)
 
@@ -6,42 +6,21 @@
 
 Define and manage spot colors programmatically for professional print workflows with exact color matching through premixed inks.
 
-![Spot Colors example showing blocks with various spot color fills and tints](https://img.ly/docs/cesdk/./assets/browser.hero.webp)
-
 > **Reading time:** 10 minutes
 >
 > **Resources:**
 >
 > - [Download examples](https://github.com/imgly/cesdk-web-examples/archive/refs/tags/release-$UBQ_VERSION$.zip)
-> - [View source on GitHub](https://github.com/imgly/cesdk-web-examples/tree/release-$UBQ_VERSION$/guides-colors-for-print-spot-browser)
-> - [Open in StackBlitz](https://stackblitz.com/github/imgly/cesdk-web-examples/tree/v$UBQ_VERSION$/guides-colors-for-print-spot-browser)
-> - [Live demo](https://img.ly/docs/cesdk/examples/guides-colors-for-print-spot-browser/)
+>
+> - [View source on GitHub](https://github.com/imgly/cesdk-web-examples/tree/release-$UBQ_VERSION$/guides-colors-for-print-spot-server-js)
+>
+> - [Open in StackBlitz](https://stackblitz.com/github/imgly/cesdk-web-examples/tree/v$UBQ_VERSION$/guides-colors-for-print-spot-server-js)
 
 Spot colors are named colors reproduced using premixed inks in print production, providing exact color matching that CMYK process colors cannot guarantee. CE.SDK maintains a registry of spot color definitions at the editor level, where each spot color has a name and screen approximations (RGB and/or CMYK) for display purposes. The actual premixed ink is used during printing based on the color name.
 
-```typescript file=@cesdk_web_examples/guides-colors-for-print-spot-browser/browser.ts reference-only
-import type {
-  EditorPlugin,
-  EditorPluginContext,
-  SpotColor
-} from '@cesdk/cesdk-js';
-import {
-  BlurAssetSource,
-  ColorPaletteAssetSource,
-  CropPresetsAssetSource,
-  DemoAssetSources,
-  EffectsAssetSource,
-  FiltersAssetSource,
-  PagePresetsAssetSource,
-  StickerAssetSource,
-  TextAssetSource,
-  TextComponentAssetSource,
-  TypefaceAssetSource,
-  UploadAssetSources,
-  VectorShapeAssetSource
-} from '@cesdk/cesdk-js/plugins';
-import { DesignEditorConfig } from './design-editor/plugin';
-import packageJson from './package.json';
+```typescript file=@cesdk_web_examples/guides-colors-for-print-spot-server-js/server-js.ts reference-only
+import CreativeEngine from '@cesdk/node';
+import type { SpotColor } from '@cesdk/node';
 
 // Type guard to check if a color is a SpotColor
 // Color can be RGBAColor, CMYKColor, or SpotColor
@@ -55,8 +34,14 @@ const isSpotColor = (color: unknown): color is SpotColor => {
   );
 };
 
+import { config } from 'dotenv';
+import { writeFileSync, mkdirSync, existsSync } from 'fs';
+
+// Load environment variables
+config();
+
 /**
- * CE.SDK Plugin: Spot Colors Guide
+ * CE.SDK Server Guide: Spot Colors
  *
  * This example demonstrates:
  * - Defining spot colors with RGB and CMYK approximations
@@ -65,349 +50,288 @@ const isSpotColor = (color: unknown): color is SpotColor => {
  * - Querying and updating spot color definitions
  * - Removing spot colors and handling the magenta fallback
  * - Assigning spot colors to cutout types
+ * - Exporting designs with spot colors for print
  */
-class Example implements EditorPlugin {
-  name = packageJson.name;
-
-  version = packageJson.version;
-
-  async initialize({ cesdk }: EditorPluginContext): Promise<void> {
-    if (!cesdk) {
-      throw new Error('CE.SDK instance is required for this plugin');
-    }
-
-    await cesdk.addPlugin(new DesignEditorConfig());
-    // Add asset source plugins
-    await cesdk.addPlugin(new BlurAssetSource());
-    await cesdk.addPlugin(new ColorPaletteAssetSource());
-    await cesdk.addPlugin(new CropPresetsAssetSource());
-    await cesdk.addPlugin(
-      new UploadAssetSources({ include: ['ly.img.image.upload'] })
-    );
-    await cesdk.addPlugin(
-      new DemoAssetSources({
-        include: [
-          'ly.img.templates.blank.*',
-          'ly.img.templates.presentation.*',
-          'ly.img.templates.print.*',
-          'ly.img.templates.social.*',
-          'ly.img.image.*'
-        ]
-      })
-    );
-    await cesdk.addPlugin(new EffectsAssetSource());
-    await cesdk.addPlugin(new FiltersAssetSource());
-    await cesdk.addPlugin(new PagePresetsAssetSource());
-    await cesdk.addPlugin(new StickerAssetSource());
-    await cesdk.addPlugin(new TextAssetSource());
-    await cesdk.addPlugin(new TextComponentAssetSource());
-    await cesdk.addPlugin(new TypefaceAssetSource());
-    await cesdk.addPlugin(new VectorShapeAssetSource());
-
-    // Create a design scene using CE.SDK convenience method
-    await cesdk.actions.run('scene.create', {
-      page: { width: 800, height: 600, unit: 'Pixel' }
-    });
-
-    const engine = cesdk.engine;
-
-    // Get the page
-    const pages = engine.block.findByType('page');
-    const page = pages[0];
-    if (!page) {
-      throw new Error('No page found');
-    }
-
-    // Set page background to light gray for visibility
-    const pageFill = engine.block.getFill(page);
-    engine.block.setColor(pageFill, 'fill/color/value', {
-      r: 0.95,
-      g: 0.95,
-      b: 0.95,
-      a: 1.0
-    });
-
-    // Helper function to create a graphic block with a color fill
-    const createColorBlock = (
-      x: number,
-      y: number,
-      width: number,
-      height: number,
-      shape: 'rect' | 'ellipse' = 'rect'
-    ): { block: number; fill: number } => {
-      const block = engine.block.create('graphic');
-      const blockShape = engine.block.createShape(shape);
-      engine.block.setShape(block, blockShape);
-      engine.block.setWidth(block, width);
-      engine.block.setHeight(block, height);
-      engine.block.setPositionX(block, x);
-      engine.block.setPositionY(block, y);
-      engine.block.appendChild(page, block);
-
-      const colorFill = engine.block.createFill('color');
-      engine.block.setFill(block, colorFill);
-
-      return { block, fill: colorFill };
-    };
-
-    // Define a spot color with RGB approximation
-    // RGB values range from 0.0 to 1.0
-    engine.editor.setSpotColorRGB('Brand-Primary', 0.8, 0.1, 0.2);
-
-    // Add CMYK approximation for the same spot color
-    // This provides print-accurate preview in addition to screen display
-    engine.editor.setSpotColorCMYK('Brand-Primary', 0.05, 0.95, 0.85, 0.0);
-
-    // Define another spot color with both approximations
-    engine.editor.setSpotColorRGB('Brand-Accent', 0.2, 0.4, 0.8);
-    engine.editor.setSpotColorCMYK('Brand-Accent', 0.75, 0.5, 0.0, 0.0);
-
-    // Apply spot colors to fills using SpotColor objects
-    // The tint property (0.0 to 1.0) controls color intensity
-    // The externalReference field stores metadata like color system origin
-    const brandPrimary: SpotColor = {
-      name: 'Brand-Primary',
-      tint: 1.0,
-      externalReference: ''
-    };
-
-    // Create a block and apply the Brand-Primary spot color
-    const { fill: primaryFill } = createColorBlock(50, 50, 150, 150);
-    engine.block.setColor(primaryFill, 'fill/color/value', brandPrimary);
-
-    // Apply Brand-Accent to another block
-    const brandAccent: SpotColor = {
-      name: 'Brand-Accent',
-      tint: 1.0,
-      externalReference: ''
-    };
-    const { fill: accentFill } = createColorBlock(220, 50, 150, 150);
-    engine.block.setColor(accentFill, 'fill/color/value', brandAccent);
-
-    // Use tints for lighter variations without defining new spot colors
-    // Tint of 0.5 gives 50% color intensity
-    const brandPrimaryHalfTint: SpotColor = {
-      name: 'Brand-Primary',
-      tint: 0.5,
-      externalReference: ''
-    };
-    const { fill: tintedFill } = createColorBlock(390, 50, 150, 150, 'ellipse');
-    engine.block.setColor(tintedFill, 'fill/color/value', brandPrimaryHalfTint);
-
-    // Create a gradient of tints
-    const brandAccentLightTint: SpotColor = {
-      name: 'Brand-Accent',
-      tint: 0.3,
-      externalReference: ''
-    };
-    const { fill: lightTintFill } = createColorBlock(560, 50, 150, 150);
-    engine.block.setColor(
-      lightTintFill,
-      'fill/color/value',
-      brandAccentLightTint
-    );
 
-    // Apply spot colors to strokes and shadows
-    const { block: strokeBlock, fill: strokeBlockFill } = createColorBlock(
-      50,
-      220,
-      150,
-      150
-    );
-    // Set fill to white
-    engine.block.setColor(strokeBlockFill, 'fill/color/value', {
-      r: 1.0,
-      g: 1.0,
-      b: 1.0,
-      a: 1.0
-    });
-
-    // Enable stroke and apply spot color
-    engine.block.setStrokeEnabled(strokeBlock, true);
-    engine.block.setStrokeWidth(strokeBlock, 8);
-    const strokeColor: SpotColor = {
-      name: 'Brand-Primary',
-      tint: 1.0,
-      externalReference: ''
-    };
-    engine.block.setColor(strokeBlock, 'stroke/color', strokeColor);
-
-    // Apply spot color to drop shadow
-    const { block: shadowBlock, fill: shadowBlockFill } = createColorBlock(
-      220,
-      220,
-      150,
-      150
-    );
-    engine.block.setColor(shadowBlockFill, 'fill/color/value', {
-      r: 0.95,
-      g: 0.95,
-      b: 0.95,
-      a: 1.0
-    });
-
-    engine.block.setDropShadowEnabled(shadowBlock, true);
-    engine.block.setDropShadowOffsetX(shadowBlock, 10);
-    engine.block.setDropShadowOffsetY(shadowBlock, 10);
-    engine.block.setDropShadowBlurRadiusX(shadowBlock, 15);
-    engine.block.setDropShadowBlurRadiusY(shadowBlock, 15);
-    const shadowColor: SpotColor = {
-      name: 'Brand-Accent',
-      tint: 0.8,
-      externalReference: ''
-    };
-    engine.block.setColor(shadowBlock, 'dropShadow/color', shadowColor);
-
-    // Query all defined spot colors
-    const spotColors = engine.editor.findAllSpotColors();
-    // eslint-disable-next-line no-console
-    console.log('Defined spot colors:', spotColors);
-
-    // Query RGB approximation for a spot color
-    const rgbaApprox = engine.editor.getSpotColorRGBA('Brand-Primary');
-    // eslint-disable-next-line no-console
-    console.log('Brand-Primary RGB approximation:', rgbaApprox);
-
-    // Query CMYK approximation for a spot color
-    const cmykApprox = engine.editor.getSpotColorCMYK('Brand-Primary');
-    // eslint-disable-next-line no-console
-    console.log('Brand-Primary CMYK approximation:', cmykApprox);
-
-    // Read back the color from a block and check if it's a spot color
-    const retrievedColor = engine.block.getColor(
-      primaryFill,
-      'fill/color/value'
+// Initialize CE.SDK engine with baseURL for asset loading
+const engine = await CreativeEngine.init({
+  // license: process.env.CESDK_LICENSE,
+  baseURL: process.env.IMGLY_LOCAL_ASSETS_URL
+});
+
+try {
+  // Create a scene with a page
+  const scene = engine.scene.create();
+  const page = engine.block.create('page');
+  engine.block.setWidth(page, 800);
+  engine.block.setHeight(page, 600);
+  engine.block.appendChild(scene, page);
+
+  // Set page background to light gray for visibility
+  const pageFill = engine.block.getFill(page);
+  engine.block.setColor(pageFill, 'fill/color/value', {
+    r: 0.95,
+    g: 0.95,
+    b: 0.95,
+    a: 1.0
+  });
+
+  // Helper function to create a graphic block with a color fill
+  const createColorBlock = (
+    x: number,
+    y: number,
+    width: number,
+    height: number,
+    shape: 'rect' | 'ellipse' = 'rect'
+  ): { block: number; fill: number } => {
+    const block = engine.block.create('graphic');
+    const blockShape = engine.block.createShape(shape);
+    engine.block.setShape(block, blockShape);
+    engine.block.setWidth(block, width);
+    engine.block.setHeight(block, height);
+    engine.block.setPositionX(block, x);
+    engine.block.setPositionY(block, y);
+    engine.block.appendChild(page, block);
+
+    const colorFill = engine.block.createFill('color');
+    engine.block.setFill(block, colorFill);
+
+    return { block, fill: colorFill };
+  };
+
+  // Define a spot color with RGB approximation
+  // RGB values range from 0.0 to 1.0
+  engine.editor.setSpotColorRGB('Brand-Primary', 0.8, 0.1, 0.2);
+
+  // Add CMYK approximation for the same spot color
+  // This provides print-accurate preview in addition to screen display
+  engine.editor.setSpotColorCMYK('Brand-Primary', 0.05, 0.95, 0.85, 0.0);
+
+  // Define another spot color with both approximations
+  engine.editor.setSpotColorRGB('Brand-Accent', 0.2, 0.4, 0.8);
+  engine.editor.setSpotColorCMYK('Brand-Accent', 0.75, 0.5, 0.0, 0.0);
+
+  // Apply spot colors to fills using SpotColor objects
+  // The tint property (0.0 to 1.0) controls color intensity
+  // The externalReference field stores metadata like color system origin
+  const brandPrimary: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 1.0,
+    externalReference: ''
+  };
+
+  // Create a block and apply the Brand-Primary spot color
+  const { fill: primaryFill } = createColorBlock(50, 50, 150, 150);
+  engine.block.setColor(primaryFill, 'fill/color/value', brandPrimary);
+
+  // Apply Brand-Accent to another block
+  const brandAccent: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 1.0,
+    externalReference: ''
+  };
+  const { fill: accentFill } = createColorBlock(220, 50, 150, 150);
+  engine.block.setColor(accentFill, 'fill/color/value', brandAccent);
+
+  // Use tints for lighter variations without defining new spot colors
+  // Tint of 0.5 gives 50% color intensity
+  const brandPrimaryHalfTint: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 0.5,
+    externalReference: ''
+  };
+  const { fill: tintedFill } = createColorBlock(390, 50, 150, 150, 'ellipse');
+  engine.block.setColor(tintedFill, 'fill/color/value', brandPrimaryHalfTint);
+
+  // Create a gradient of tints
+  const brandAccentLightTint: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 0.3,
+    externalReference: ''
+  };
+  const { fill: lightTintFill } = createColorBlock(560, 50, 150, 150);
+  engine.block.setColor(
+    lightTintFill,
+    'fill/color/value',
+    brandAccentLightTint
+  );
+
+  // Apply spot colors to strokes and shadows
+  const { block: strokeBlock, fill: strokeBlockFill } = createColorBlock(
+    50,
+    220,
+    150,
+    150
+  );
+  // Set fill to white
+  engine.block.setColor(strokeBlockFill, 'fill/color/value', {
+    r: 1.0,
+    g: 1.0,
+    b: 1.0,
+    a: 1.0
+  });
+
+  // Enable stroke and apply spot color
+  engine.block.setStrokeEnabled(strokeBlock, true);
+  engine.block.setStrokeWidth(strokeBlock, 8);
+  const strokeColor: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(strokeBlock, 'stroke/color', strokeColor);
+
+  // Apply spot color to drop shadow
+  const { block: shadowBlock, fill: shadowBlockFill } = createColorBlock(
+    220,
+    220,
+    150,
+    150
+  );
+  engine.block.setColor(shadowBlockFill, 'fill/color/value', {
+    r: 0.95,
+    g: 0.95,
+    b: 0.95,
+    a: 1.0
+  });
+
+  engine.block.setDropShadowEnabled(shadowBlock, true);
+  engine.block.setDropShadowOffsetX(shadowBlock, 10);
+  engine.block.setDropShadowOffsetY(shadowBlock, 10);
+  engine.block.setDropShadowBlurRadiusX(shadowBlock, 15);
+  engine.block.setDropShadowBlurRadiusY(shadowBlock, 15);
+  const shadowColor: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 0.8,
+    externalReference: ''
+  };
+  engine.block.setColor(shadowBlock, 'dropShadow/color', shadowColor);
+
+  // Query all defined spot colors
+  const spotColors = engine.editor.findAllSpotColors();
+  console.log('Defined spot colors:', spotColors);
+
+  // Query RGB approximation for a spot color
+  const rgbaApprox = engine.editor.getSpotColorRGBA('Brand-Primary');
+  console.log('Brand-Primary RGB approximation:', rgbaApprox);
+
+  // Query CMYK approximation for a spot color
+  const cmykApprox = engine.editor.getSpotColorCMYK('Brand-Primary');
+  console.log('Brand-Primary CMYK approximation:', cmykApprox);
+
+  // Read back the color from a block and check if it's a spot color
+  const retrievedColor = engine.block.getColor(primaryFill, 'fill/color/value');
+  if (isSpotColor(retrievedColor)) {
+    console.log(
+      `Retrieved SpotColor - Name: ${retrievedColor.name}, Tint: ${retrievedColor.tint}`
     );
-    if (isSpotColor(retrievedColor)) {
-      // eslint-disable-next-line no-console
-      console.log(
-        `Retrieved SpotColor - Name: ${retrievedColor.name}, Tint: ${retrievedColor.tint}`
-      );
-    }
-
-    // Update an existing spot color's approximation
-    // This changes how the color appears on screen without affecting the color name
-    engine.editor.setSpotColorRGB('Brand-Accent', 0.3, 0.5, 0.9);
-    // eslint-disable-next-line no-console
-    console.log('Updated Brand-Accent RGB approximation');
-
-    // Show the updated color in a new block
-    const { fill: updatedFill } = createColorBlock(390, 220, 150, 150);
-    const updatedAccent: SpotColor = {
-      name: 'Brand-Accent',
-      tint: 1.0,
-      externalReference: ''
-    };
-    engine.block.setColor(updatedFill, 'fill/color/value', updatedAccent);
-
-    // Define a temporary spot color
-    engine.editor.setSpotColorRGB('Temporary-Color', 0.5, 0.8, 0.3);
-
-    // Create a block using the temporary color
-    const { fill: tempFill } = createColorBlock(560, 220, 150, 150);
-    const tempColor: SpotColor = {
-      name: 'Temporary-Color',
-      tint: 1.0,
-      externalReference: ''
-    };
-    engine.block.setColor(tempFill, 'fill/color/value', tempColor);
-
-    // Remove the spot color definition
-    // Blocks using this color will display magenta (default fallback)
-    engine.editor.removeSpotColor('Temporary-Color');
-
-    // eslint-disable-next-line no-console
-    console.log('Removed Temporary-Color - block now shows magenta fallback');
-
-    // Verify the color is no longer defined
-    const remainingSpotColors = engine.editor.findAllSpotColors();
-    // eslint-disable-next-line no-console
-    console.log('Remaining spot colors:', remainingSpotColors);
-
-    // Assign spot colors to cutout types for die-cutting operations
-    // First define a spot color for the die line
-    engine.editor.setSpotColorRGB('DieLine', 1.0, 0.0, 1.0);
-    engine.editor.setSpotColorCMYK('DieLine', 0.0, 1.0, 0.0, 0.0);
-
-    // Associate the spot color with a cutout type
-    // CutoutType can be 'Solid' or 'Dashed'
-    engine.editor.setSpotColorForCutoutType('Solid', 'DieLine');
-
-    // Query the assigned spot color
-    const cutoutSpotColor = engine.editor.getSpotColorForCutoutType('Solid');
-    // eslint-disable-next-line no-console
-    console.log('Cutout type Solid uses spot color:', cutoutSpotColor);
-
-    // Create a legend block with text
-    const textBlock = engine.block.create('text');
-    engine.block.replaceText(textBlock, 'Spot Colors Demo');
-    engine.block.setTextFontSize(textBlock, 36);
-    engine.block.setWidthMode(textBlock, 'Auto');
-    engine.block.setHeightMode(textBlock, 'Auto');
-    engine.block.setPositionX(textBlock, 50);
-    engine.block.setPositionY(textBlock, 400);
-    engine.block.appendChild(page, textBlock);
-
-    // Create smaller label texts
-    const labels = [
-      { text: 'Brand-Primary', x: 50, y: 205 },
-      { text: 'Brand-Accent', x: 220, y: 205 },
-      { text: 'Primary 50%', x: 390, y: 205 },
-      { text: 'Accent 30%', x: 560, y: 205 },
-      { text: 'Stroke', x: 50, y: 375 },
-      { text: 'Shadow', x: 220, y: 375 },
-      { text: 'Updated', x: 390, y: 375 },
-      { text: 'Removed', x: 560, y: 375 }
-    ];
-
-    for (const label of labels) {
-      const labelBlock = engine.block.create('text');
-      engine.block.replaceText(labelBlock, label.text);
-      engine.block.setTextFontSize(labelBlock, 14);
-      engine.block.setWidthMode(labelBlock, 'Auto');
-      engine.block.setHeightMode(labelBlock, 'Auto');
-      engine.block.setPositionX(labelBlock, label.x);
-      engine.block.setPositionY(labelBlock, label.y);
-      engine.block.appendChild(page, labelBlock);
-    }
-
-    // Zoom to fit all content
-    await engine.scene.zoomToBlock(page, {
-      padding: {
-        left: 40,
-        top: 40,
-        right: 40,
-        bottom: 40
-      }
-    });
   }
-}
 
-export default Example;
+  // Update an existing spot color's approximation
+  // This changes how the color appears on screen without affecting the color name
+  engine.editor.setSpotColorRGB('Brand-Accent', 0.3, 0.5, 0.9);
+  console.log('Updated Brand-Accent RGB approximation');
+
+  // Show the updated color in a new block
+  const { fill: updatedFill } = createColorBlock(390, 220, 150, 150);
+  const updatedAccent: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(updatedFill, 'fill/color/value', updatedAccent);
+
+  // Define a temporary spot color
+  engine.editor.setSpotColorRGB('Temporary-Color', 0.5, 0.8, 0.3);
+
+  // Create a block using the temporary color
+  const { fill: tempFill } = createColorBlock(560, 220, 150, 150);
+  const tempColor: SpotColor = {
+    name: 'Temporary-Color',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(tempFill, 'fill/color/value', tempColor);
+
+  // Remove the spot color definition
+  // Blocks using this color will display magenta (default fallback)
+  engine.editor.removeSpotColor('Temporary-Color');
+
+  console.log('Removed Temporary-Color - block now shows magenta fallback');
+
+  // Verify the color is no longer defined
+  const remainingSpotColors = engine.editor.findAllSpotColors();
+  console.log('Remaining spot colors:', remainingSpotColors);
+
+  // Assign spot colors to cutout types for die-cutting operations
+  // First define a spot color for the die line
+  engine.editor.setSpotColorRGB('DieLine', 1.0, 0.0, 1.0);
+  engine.editor.setSpotColorCMYK('DieLine', 0.0, 1.0, 0.0, 0.0);
+
+  // Associate the spot color with a cutout type
+  // CutoutType can be 'Solid' or 'Dashed'
+  engine.editor.setSpotColorForCutoutType('Solid', 'DieLine');
+
+  // Query the assigned spot color
+  const cutoutSpotColor = engine.editor.getSpotColorForCutoutType('Solid');
+  console.log('Cutout type Solid uses spot color:', cutoutSpotColor);
+
+  // Export the design
+  const outputDir = './output';
+  if (!existsSync(outputDir)) {
+    mkdirSync(outputDir, { recursive: true });
+  }
+
+  // Export as PNG for preview
+  const pngBlob = await engine.block.export(page, { mimeType: 'image/png' });
+  const pngBuffer = Buffer.from(await pngBlob.arrayBuffer());
+  writeFileSync(`${outputDir}/spot-colors.png`, pngBuffer);
+  console.log(`\nPNG exported: ${outputDir}/spot-colors.png`);
+
+  // Export as PDF for print (preserves spot colors)
+  const pdfBlob = await engine.block.export(page, {
+    mimeType: 'application/pdf'
+  });
+  const pdfBuffer = Buffer.from(await pdfBlob.arrayBuffer());
+  writeFileSync(`${outputDir}/spot-colors.pdf`, pdfBuffer);
+  console.log(`PDF exported: ${outputDir}/spot-colors.pdf`);
+
+  console.log('\nSpot Colors example completed successfully!');
+} finally {
+  // Always dispose the engine to free resources
+  engine.dispose();
+}
 ```
 
-This guide covers how to define spot colors with RGB and CMYK approximations, apply them to design elements with varying tints, query and update definitions, and assign spot colors to cutout types for die-cutting operations.
+This guide covers how to define spot colors with RGB and CMYK approximations, apply them to design elements with varying tints, query and update definitions, assign spot colors to cutout types for die-cutting operations, and export designs with spot colors for print production.
 
-## Understanding Spot Colors
+## Setup
+
+Initialize the CE.SDK engine for server-side spot color management:
 
-Spot colors differ from CMYK process colors in several important ways:
+```typescript highlight-setup
+// Initialize CE.SDK engine with baseURL for asset loading
+const engine = await CreativeEngine.init({
+  // license: process.env.CESDK_LICENSE,
+  baseURL: process.env.IMGLY_LOCAL_ASSETS_URL
+});
+```
+
+## Understanding Spot Colors
 
-- **Exact color matching** - Premixed inks guarantee consistent color reproduction across print runs
-- **Brand consistency** - Essential for logos and brand colors (e.g., Pantone colors)
-- **Specialty effects** - Enable metallic, fluorescent, and other specialty inks
-- **Color gamut** - Some colors are unreproducible with CMYK process inks
+A spot color in CE.SDK consists of:
 
-In CE.SDK, spot colors have three components:
+- **Name**: A unique identifier for the spot color (e.g., "Brand-Red-185", "Brand-Primary")
+- **Tint**: A value from 0.0 to 1.0 controlling color intensity
+- **External Reference**: Optional metadata linking to external color systems
 
-- **Name** - The identifier used in print output (e.g., "Pantone-485-C")
-- **Approximations** - RGB and/or CMYK values for screen display
-- **Tint** - A value from 0.0 to 1.0 controlling color intensity
+Screen approximations (RGB and CMYK values) are stored separately and define how the spot color appears on screen during design. The actual printed color comes from the premixed ink specified by the spot color name.
 
-## Define Spot Colors
+## Defining Spot Colors
 
 ### RGB Approximation
 
-We register spot colors using `engine.editor.setSpotColorRGB()`. This creates a new spot color if the name doesn't exist, or updates the approximation if it does.
+Define how a spot color should appear on screen using RGB values:
 
 ```typescript highlight-define-spot-rgb
 // Define a spot color with RGB approximation
@@ -415,184 +339,170 @@ We register spot colors using `engine.editor.setSpotColorRGB()`. This creates a
 engine.editor.setSpotColorRGB('Brand-Primary', 0.8, 0.1, 0.2);
 ```
 
-RGB approximations display the spot color on screen during editing. The values range from 0.0 to 1.0 for each channel.
+RGB values range from 0.0 to 1.0. This approximation is used for screen display in applications that work in RGB color space.
 
 ### CMYK Approximation
 
-We can add a CMYK approximation using `engine.editor.setSpotColorCMYK()`. This provides print-accurate previews alongside the RGB screen display.
+Add a CMYK approximation for print preview accuracy:
 
 ```typescript highlight-define-spot-cmyk
-// Add CMYK approximation for the same spot color
-// This provides print-accurate preview in addition to screen display
-engine.editor.setSpotColorCMYK('Brand-Primary', 0.05, 0.95, 0.85, 0.0);
+  // Add CMYK approximation for the same spot color
+  // This provides print-accurate preview in addition to screen display
+  engine.editor.setSpotColorCMYK('Brand-Primary', 0.05, 0.95, 0.85, 0.0);
 
-// Define another spot color with both approximations
-engine.editor.setSpotColorRGB('Brand-Accent', 0.2, 0.4, 0.8);
-engine.editor.setSpotColorCMYK('Brand-Accent', 0.75, 0.5, 0.0, 0.0);
+  // Define another spot color with both approximations
+  engine.editor.setSpotColorRGB('Brand-Accent', 0.2, 0.4, 0.8);
+  engine.editor.setSpotColorCMYK('Brand-Accent', 0.75, 0.5, 0.0, 0.0);
 ```
 
-For best results, provide both RGB and CMYK approximations for each spot color. RGB displays on screen while CMYK enables accurate print preview.
+CMYK values also range from 0.0 to 1.0. Having both RGB and CMYK approximations ensures accurate preview in both screen-based and print-oriented workflows.
 
-## Apply Spot Colors to Design Elements
+## Applying Spot Colors
 
-We apply spot colors to blocks using `engine.block.setColor()` with a SpotColor object containing `name`, `tint`, and `externalReference`.
+### To Fills
 
-```typescript highlight-apply-spot-fill
-// Apply spot colors to fills using SpotColor objects
-// The tint property (0.0 to 1.0) controls color intensity
-// The externalReference field stores metadata like color system origin
-const brandPrimary: SpotColor = {
-  name: 'Brand-Primary',
-  tint: 1.0,
-  externalReference: ''
-};
+Apply spot colors to block fills using the `SpotColor` type:
 
-// Create a block and apply the Brand-Primary spot color
-const { fill: primaryFill } = createColorBlock(50, 50, 150, 150);
-engine.block.setColor(primaryFill, 'fill/color/value', brandPrimary);
+```typescript highlight-apply-spot-fill
+  // Apply spot colors to fills using SpotColor objects
+  // The tint property (0.0 to 1.0) controls color intensity
+  // The externalReference field stores metadata like color system origin
+  const brandPrimary: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 1.0,
+    externalReference: ''
+  };
+
+  // Create a block and apply the Brand-Primary spot color
+  const { fill: primaryFill } = createColorBlock(50, 50, 150, 150);
+  engine.block.setColor(primaryFill, 'fill/color/value', brandPrimary);
 ```
 
-The SpotColor object has these properties:
-
-- **name** - Must match a defined spot color exactly (case-sensitive)
-- **tint** - Controls intensity from 0.0 (transparent) to 1.0 (full strength)
-- **externalReference** - Optional metadata like the color system origin (e.g., "Pantone")
+The `SpotColor` object contains:
 
-> **Note:** The spot color must be defined before applying it to blocks. Undefined spot colors display as magenta—the default fallback color.
+- `name`: References a defined spot color
+- `tint`: Controls intensity (1.0 = full strength)
+- `externalReference`: Optional metadata for color system integration
 
 ### Using Tints
 
-Tints create lighter variations without defining separate spot colors for each shade. A tint of 0.5 gives 50% color intensity.
+Create lighter variations without defining new spot colors:
 
 ```typescript highlight-tint
-// Use tints for lighter variations without defining new spot colors
-// Tint of 0.5 gives 50% color intensity
-const brandPrimaryHalfTint: SpotColor = {
-  name: 'Brand-Primary',
-  tint: 0.5,
-  externalReference: ''
-};
-const { fill: tintedFill } = createColorBlock(390, 50, 150, 150, 'ellipse');
-engine.block.setColor(tintedFill, 'fill/color/value', brandPrimaryHalfTint);
-
-// Create a gradient of tints
-const brandAccentLightTint: SpotColor = {
-  name: 'Brand-Accent',
-  tint: 0.3,
-  externalReference: ''
-};
-const { fill: lightTintFill } = createColorBlock(560, 50, 150, 150);
-engine.block.setColor(lightTintFill, 'fill/color/value', brandAccentLightTint);
+  // Use tints for lighter variations without defining new spot colors
+  // Tint of 0.5 gives 50% color intensity
+  const brandPrimaryHalfTint: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 0.5,
+    externalReference: ''
+  };
+  const { fill: tintedFill } = createColorBlock(390, 50, 150, 150, 'ellipse');
+  engine.block.setColor(tintedFill, 'fill/color/value', brandPrimaryHalfTint);
+
+  // Create a gradient of tints
+  const brandAccentLightTint: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 0.3,
+    externalReference: ''
+  };
+  const { fill: lightTintFill } = createColorBlock(560, 50, 150, 150);
+  engine.block.setColor(
+    lightTintFill,
+    'fill/color/value',
+    brandAccentLightTint
+  );
 ```
 
-Use tints for:
-
-- Color variations in design systems
-- Lighter backgrounds using brand colors
-- Gradient-like effects with consistent spot color names
+Tints are particularly useful for creating consistent color hierarchies in designs while maintaining a single spot color definition for print production.
 
-### Strokes and Shadows
+### To Strokes and Shadows
 
-Spot colors work with any color property, including strokes and drop shadows.
+Spot colors work with all color properties:
 
 ```typescript highlight-stroke-shadow
-// Apply spot colors to strokes and shadows
-const { block: strokeBlock, fill: strokeBlockFill } = createColorBlock(
-  50,
-  220,
-  150,
-  150
-);
-// Set fill to white
-engine.block.setColor(strokeBlockFill, 'fill/color/value', {
-  r: 1.0,
-  g: 1.0,
-  b: 1.0,
-  a: 1.0
-});
-
-// Enable stroke and apply spot color
-engine.block.setStrokeEnabled(strokeBlock, true);
-engine.block.setStrokeWidth(strokeBlock, 8);
-const strokeColor: SpotColor = {
-  name: 'Brand-Primary',
-  tint: 1.0,
-  externalReference: ''
-};
-engine.block.setColor(strokeBlock, 'stroke/color', strokeColor);
-
-// Apply spot color to drop shadow
-const { block: shadowBlock, fill: shadowBlockFill } = createColorBlock(
-  220,
-  220,
-  150,
-  150
-);
-engine.block.setColor(shadowBlockFill, 'fill/color/value', {
-  r: 0.95,
-  g: 0.95,
-  b: 0.95,
-  a: 1.0
-});
-
-engine.block.setDropShadowEnabled(shadowBlock, true);
-engine.block.setDropShadowOffsetX(shadowBlock, 10);
-engine.block.setDropShadowOffsetY(shadowBlock, 10);
-engine.block.setDropShadowBlurRadiusX(shadowBlock, 15);
-engine.block.setDropShadowBlurRadiusY(shadowBlock, 15);
-const shadowColor: SpotColor = {
-  name: 'Brand-Accent',
-  tint: 0.8,
-  externalReference: ''
-};
-engine.block.setColor(shadowBlock, 'dropShadow/color', shadowColor);
+  // Apply spot colors to strokes and shadows
+  const { block: strokeBlock, fill: strokeBlockFill } = createColorBlock(
+    50,
+    220,
+    150,
+    150
+  );
+  // Set fill to white
+  engine.block.setColor(strokeBlockFill, 'fill/color/value', {
+    r: 1.0,
+    g: 1.0,
+    b: 1.0,
+    a: 1.0
+  });
+
+  // Enable stroke and apply spot color
+  engine.block.setStrokeEnabled(strokeBlock, true);
+  engine.block.setStrokeWidth(strokeBlock, 8);
+  const strokeColor: SpotColor = {
+    name: 'Brand-Primary',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(strokeBlock, 'stroke/color', strokeColor);
+
+  // Apply spot color to drop shadow
+  const { block: shadowBlock, fill: shadowBlockFill } = createColorBlock(
+    220,
+    220,
+    150,
+    150
+  );
+  engine.block.setColor(shadowBlockFill, 'fill/color/value', {
+    r: 0.95,
+    g: 0.95,
+    b: 0.95,
+    a: 1.0
+  });
+
+  engine.block.setDropShadowEnabled(shadowBlock, true);
+  engine.block.setDropShadowOffsetX(shadowBlock, 10);
+  engine.block.setDropShadowOffsetY(shadowBlock, 10);
+  engine.block.setDropShadowBlurRadiusX(shadowBlock, 15);
+  engine.block.setDropShadowBlurRadiusY(shadowBlock, 15);
+  const shadowColor: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 0.8,
+    externalReference: ''
+  };
+  engine.block.setColor(shadowBlock, 'dropShadow/color', shadowColor);
 ```
 
-The `stroke/color` and `dropShadow/color` properties accept the same SpotColor objects as fill colors.
-
-## Query Spot Color Definitions
+## Querying Spot Colors
 
-### List Defined Spot Colors
+### List All Spot Colors
 
-We retrieve all defined spot colors with `engine.editor.findAllSpotColors()`.
+Retrieve all defined spot colors in the current editor session:
 
 ```typescript highlight-query-spot
-// Query all defined spot colors
-const spotColors = engine.editor.findAllSpotColors();
-// eslint-disable-next-line no-console
-console.log('Defined spot colors:', spotColors);
-
-// Query RGB approximation for a spot color
-const rgbaApprox = engine.editor.getSpotColorRGBA('Brand-Primary');
-// eslint-disable-next-line no-console
-console.log('Brand-Primary RGB approximation:', rgbaApprox);
-
-// Query CMYK approximation for a spot color
-const cmykApprox = engine.editor.getSpotColorCMYK('Brand-Primary');
-// eslint-disable-next-line no-console
-console.log('Brand-Primary CMYK approximation:', cmykApprox);
-
-// Read back the color from a block and check if it's a spot color
-const retrievedColor = engine.block.getColor(primaryFill, 'fill/color/value');
-if (isSpotColor(retrievedColor)) {
-  // eslint-disable-next-line no-console
-  console.log(
-    `Retrieved SpotColor - Name: ${retrievedColor.name}, Tint: ${retrievedColor.tint}`
-  );
-}
+  // Query all defined spot colors
+  const spotColors = engine.editor.findAllSpotColors();
+  console.log('Defined spot colors:', spotColors);
+
+  // Query RGB approximation for a spot color
+  const rgbaApprox = engine.editor.getSpotColorRGBA('Brand-Primary');
+  console.log('Brand-Primary RGB approximation:', rgbaApprox);
+
+  // Query CMYK approximation for a spot color
+  const cmykApprox = engine.editor.getSpotColorCMYK('Brand-Primary');
+  console.log('Brand-Primary CMYK approximation:', cmykApprox);
+
+  // Read back the color from a block and check if it's a spot color
+  const retrievedColor = engine.block.getColor(primaryFill, 'fill/color/value');
+  if (isSpotColor(retrievedColor)) {
+    console.log(
+      `Retrieved SpotColor - Name: ${retrievedColor.name}, Tint: ${retrievedColor.tint}`
+    );
+  }
 ```
 
-This returns an array of spot color names currently registered in the editor.
-
-### Get Color Approximations
-
-Query individual color approximations with `engine.editor.getSpotColorRGBA()` or `engine.editor.getSpotColorCMYK()`.
-
-Querying an undefined spot color returns magenta values—use this to detect missing definitions.
-
-### Read Colors from Blocks
+### Reading Back Colors
 
-When reading a color back from a block, `engine.block.getColor()` can return an `RGBAColor`, `CMYKColor`, or `SpotColor`. Use a type guard to check if it's a SpotColor:
+When reading colors from blocks, `engine.block.getColor()` can return an `RGBAColor`, `CMYKColor`, or `SpotColor`. Use a type guard to check if the color is a spot color:
 
 ```typescript
 const isSpotColor = (color: unknown): color is SpotColor => {
@@ -605,96 +515,118 @@ const isSpotColor = (color: unknown): color is SpotColor => {
   );
 };
 
-const retrievedColor = engine.block.getColor(fill, 'fill/color/value');
-if (isSpotColor(retrievedColor)) {
-  console.log(`Name: ${retrievedColor.name}, Tint: ${retrievedColor.tint}`);
+const color = engine.block.getColor(fill, 'fill/color/value');
+if (isSpotColor(color)) {
+  console.log(`Spot color: ${color.name} at ${color.tint * 100}% tint`);
 }
 ```
 
-## Update and Remove Spot Colors
+## Updating Spot Colors
 
-### Update Approximations
-
-We update spot colors by calling the set methods again with the same name. This changes how the color appears on screen without affecting the color name in the print output.
+Modify a spot color's screen approximation. All blocks using this spot color will automatically display the updated appearance:
 
 ```typescript highlight-update-spot
-// Update an existing spot color's approximation
-// This changes how the color appears on screen without affecting the color name
-engine.editor.setSpotColorRGB('Brand-Accent', 0.3, 0.5, 0.9);
-// eslint-disable-next-line no-console
-console.log('Updated Brand-Accent RGB approximation');
-
-// Show the updated color in a new block
-const { fill: updatedFill } = createColorBlock(390, 220, 150, 150);
-const updatedAccent: SpotColor = {
-  name: 'Brand-Accent',
-  tint: 1.0,
-  externalReference: ''
-};
-engine.block.setColor(updatedFill, 'fill/color/value', updatedAccent);
+  // Update an existing spot color's approximation
+  // This changes how the color appears on screen without affecting the color name
+  engine.editor.setSpotColorRGB('Brand-Accent', 0.3, 0.5, 0.9);
+  console.log('Updated Brand-Accent RGB approximation');
+
+  // Show the updated color in a new block
+  const { fill: updatedFill } = createColorBlock(390, 220, 150, 150);
+  const updatedAccent: SpotColor = {
+    name: 'Brand-Accent',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(updatedFill, 'fill/color/value', updatedAccent);
 ```
 
-Existing blocks using that spot color automatically reflect the updated approximation.
+This updates only the screen preview. The actual printed output depends on the physical premixed ink identified by the spot color name.
 
-### Remove Spot Colors
+## Removing Spot Colors
 
-We remove spot colors with `engine.editor.removeSpotColor()` when they're no longer needed.
+Remove a spot color definition when it's no longer needed:
 
 ```typescript highlight-remove-spot
-// Define a temporary spot color
-engine.editor.setSpotColorRGB('Temporary-Color', 0.5, 0.8, 0.3);
-
-// Create a block using the temporary color
-const { fill: tempFill } = createColorBlock(560, 220, 150, 150);
-const tempColor: SpotColor = {
-  name: 'Temporary-Color',
-  tint: 1.0,
-  externalReference: ''
-};
-engine.block.setColor(tempFill, 'fill/color/value', tempColor);
+  // Define a temporary spot color
+  engine.editor.setSpotColorRGB('Temporary-Color', 0.5, 0.8, 0.3);
+
+  // Create a block using the temporary color
+  const { fill: tempFill } = createColorBlock(560, 220, 150, 150);
+  const tempColor: SpotColor = {
+    name: 'Temporary-Color',
+    tint: 1.0,
+    externalReference: ''
+  };
+  engine.block.setColor(tempFill, 'fill/color/value', tempColor);
+
+  // Remove the spot color definition
+  // Blocks using this color will display magenta (default fallback)
+  engine.editor.removeSpotColor('Temporary-Color');
+
+  console.log('Removed Temporary-Color - block now shows magenta fallback');
+
+  // Verify the color is no longer defined
+  const remainingSpotColors = engine.editor.findAllSpotColors();
+  console.log('Remaining spot colors:', remainingSpotColors);
+```
 
-// Remove the spot color definition
-// Blocks using this color will display magenta (default fallback)
-engine.editor.removeSpotColor('Temporary-Color');
+Blocks that reference a removed spot color will display in magenta (the default fallback color) to indicate the missing definition.
 
-// eslint-disable-next-line no-console
-console.log('Removed Temporary-Color - block now shows magenta fallback');
+## Spot Colors for Cutouts
 
-// Verify the color is no longer defined
-const remainingSpotColors = engine.editor.findAllSpotColors();
-// eslint-disable-next-line no-console
-console.log('Remaining spot colors:', remainingSpotColors);
+Assign spot colors to cutout types for die-cutting operations in packaging and label production:
+
+```typescript highlight-cutout
+  // Assign spot colors to cutout types for die-cutting operations
+  // First define a spot color for the die line
+  engine.editor.setSpotColorRGB('DieLine', 1.0, 0.0, 1.0);
+  engine.editor.setSpotColorCMYK('DieLine', 0.0, 1.0, 0.0, 0.0);
+
+  // Associate the spot color with a cutout type
+  // CutoutType can be 'Solid' or 'Dashed'
+  engine.editor.setSpotColorForCutoutType('Solid', 'DieLine');
+
+  // Query the assigned spot color
+  const cutoutSpotColor = engine.editor.getSpotColorForCutoutType('Solid');
+  console.log('Cutout type Solid uses spot color:', cutoutSpotColor);
 ```
 
-Removing a spot color doesn't affect blocks already using it—they display magenta until redefined or until you apply a different color.
+Available cutout types are `'Solid'` and `'Dashed'`, representing different die-line styles used in print finishing.
 
-## Spot Colors for Cutouts
+## Exporting with Spot Colors
 
-CE.SDK supports assigning spot colors to cutout types for die-cutting, embossing, and other print finishing operations.
+Export designs while preserving spot color information:
 
-```typescript highlight-cutout
-// Assign spot colors to cutout types for die-cutting operations
-// First define a spot color for the die line
-engine.editor.setSpotColorRGB('DieLine', 1.0, 0.0, 1.0);
-engine.editor.setSpotColorCMYK('DieLine', 0.0, 1.0, 0.0, 0.0);
-
-// Associate the spot color with a cutout type
-// CutoutType can be 'Solid' or 'Dashed'
-engine.editor.setSpotColorForCutoutType('Solid', 'DieLine');
-
-// Query the assigned spot color
-const cutoutSpotColor = engine.editor.getSpotColorForCutoutType('Solid');
-// eslint-disable-next-line no-console
-console.log('Cutout type Solid uses spot color:', cutoutSpotColor);
+```typescript highlight-export
+  // Export the design
+  const outputDir = './output';
+  if (!existsSync(outputDir)) {
+    mkdirSync(outputDir, { recursive: true });
+  }
+
+  // Export as PNG for preview
+  const pngBlob = await engine.block.export(page, { mimeType: 'image/png' });
+  const pngBuffer = Buffer.from(await pngBlob.arrayBuffer());
+  writeFileSync(`${outputDir}/spot-colors.png`, pngBuffer);
+  console.log(`\nPNG exported: ${outputDir}/spot-colors.png`);
+
+  // Export as PDF for print (preserves spot colors)
+  const pdfBlob = await engine.block.export(page, {
+    mimeType: 'application/pdf'
+  });
+  const pdfBuffer = Buffer.from(await pdfBlob.arrayBuffer());
+  writeFileSync(`${outputDir}/spot-colors.pdf`, pdfBuffer);
+  console.log(`PDF exported: ${outputDir}/spot-colors.pdf`);
 ```
 
-Use `engine.editor.setSpotColorForCutoutType()` to associate a spot color with a specific cutout type. Available cutout types are `'Solid'` and `'Dashed'`, representing different die-line styles used in print finishing. All cutout blocks of that type automatically use the assigned spot color in the output. Query the assignment with `engine.editor.getSpotColorForCutoutType()`.
+When exporting to PDF, spot colors are embedded as named separations that RIP software can extract for plate generation. PNG exports use the RGB approximation for raster output.
 
 ## Best Practices
 
 **Define early** - Register spot colors at initialization before applying them to blocks. Undefined colors display as magenta, which can confuse users.
 
-**Use descriptive names** - Match your print vendor's reference (e.g., "Pantone-485-C") to ensure correct ink matching in production.
+**Use descriptive names** - Match your print vendor's reference (e.g., "Brand-Red-485") to ensure correct ink matching in production.
 
 **Provide both approximations** - RGB for screen display, CMYK for print-accurate previews. This gives designers the best experience across different workflows.
 
@@ -722,18 +654,18 @@ Ensure you're using the exact name string. Note that removing a spot color doesn
 
 ## API Reference
 
-| Method                                                 | Description                                      |
-| ------------------------------------------------------ | ------------------------------------------------ |
-| `engine.editor.setSpotColorRGB(name, r, g, b)`         | Define/update spot color with RGB approximation  |
-| `engine.editor.setSpotColorCMYK(name, c, m, y, k)`     | Define/update spot color with CMYK approximation |
-| `engine.editor.findAllSpotColors()`                    | Get array of all defined spot color names        |
-| `engine.editor.getSpotColorRGBA(name)`                 | Query RGB approximation for a spot color         |
-| `engine.editor.getSpotColorCMYK(name)`                 | Query CMYK approximation for a spot color        |
-| `engine.editor.removeSpotColor(name)`                  | Remove a spot color from the registry            |
-| `engine.editor.setSpotColorForCutoutType(type, color)` | Assign spot color to a cutout type               |
-| `engine.editor.getSpotColorForCutoutType(type)`        | Get spot color assigned to a cutout type         |
-| `engine.block.setColor(block, property, color)`        | Apply color (including SpotColor) to a property  |
-| `engine.block.getColor(block, property)`               | Read color from a block property                 |
+| Method                                            | Description                                      |
+| ------------------------------------------------- | ------------------------------------------------ |
+| `engine.editor.setSpotColorRGB(name, r, g, b)`    | Define/update spot color with RGB approximation  |
+| `engine.editor.setSpotColorCMYK(name, c, m, y, k)` | Define/update spot color with CMYK approximation |
+| `engine.editor.findAllSpotColors()`               | Get array of all defined spot color names        |
+| `engine.editor.getSpotColorRGBA(name)`            | Query RGB approximation for a spot color         |
+| `engine.editor.getSpotColorCMYK(name)`            | Query CMYK approximation for a spot color        |
+| `engine.editor.removeSpotColor(name)`             | Remove a spot color from the registry            |
+| `engine.editor.setSpotColorForCutoutType(type, color)` | Assign spot color to a cutout type          |
+| `engine.editor.getSpotColorForCutoutType(type)`   | Get spot color assigned to a cutout type         |
+| `engine.block.setColor(block, property, color)`   | Apply color (including SpotColor) to a property  |
+| `engine.block.getColor(block, property)`          | Read color from a block property                 |
 
 ## Next Steps
 
@@ -741,11 +673,22 @@ Ensure you're using the exact name string. Note that removing a spot color doesn
 - [Apply Colors](./colors/apply.md) - Apply colors to fills, strokes, and shadows
 - [CMYK Colors](./colors/for-print/cmyk.md) - Work with CMYK process colors
 
+## Cleanup
+
+Always dispose the engine when done to free resources:
+
+```typescript highlight-cleanup
+// Always dispose the engine to free resources
+engine.dispose();
+```
+
+
+
 ---
 
 ## More Resources
 
-- **[Vanilla JS/TS Documentation Index](https://img.ly/docs/cesdk/js.md)** - Browse all Vanilla JS/TS documentation
+- **[Node.js Documentation Index](https://img.ly/docs/cesdk/node.md)** - Browse all Node.js documentation
 - **[Complete Documentation](./llms-full.txt.md)** - Full documentation in one file (for LLMs)
-- **[Web Documentation](./js.md)** - Interactive documentation with examples
-- **[Support](mailto:support@img.ly)** - Contact IMG.LY support
+- **[Web Documentation](./node.md)** - Interactive documentation with examples
+- **[Support](mailto:support@img.ly)** - Contact IMG.LY support