circuit-to-svg 0.0.277 → 0.0.279

package/dist/index.js

@@ -1586,7 +1586,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
   const isCoveredWithSolderMask = Boolean(hole.is_covered_with_solder_mask);
   const soldermaskMargin = (hole.soldermask_margin ?? 0) * Math.abs(transform.a);
   const shouldShowSolderMask = showSolderMask && isCoveredWithSolderMask && soldermaskMargin !== 0;
-  const solderMaskColor = colorMap2.soldermask.top;
+  const solderMaskColor = colorMap2.soldermaskWithCopperUnderneath.top;
   if (hole.shape === "pill") {
     const scaledOuterWidth = hole.outer_width * Math.abs(transform.a);
     const scaledOuterHeight = hole.outer_height * Math.abs(transform.a);
@@ -1609,7 +1609,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
         return `M${-radius},0 a${radius},${radius} 0 0 1 ${width},0 a${radius},${radius} 0 0 1 ${-width},0 z`;
       }
     };
-    const children = [
+    let children = [
       // Outer pill shape
       {
         name: "path",
@@ -1644,19 +1644,57 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
     if (shouldShowSolderMask) {
       const maskWidth = scaledOuterWidth + 2 * soldermaskMargin;
       const maskHeight = scaledOuterHeight + 2 * soldermaskMargin;
-      children.push({
-        name: "path",
-        type: "element",
-        attributes: {
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          d: createPillPath(maskWidth, maskHeight),
-          transform: outerTransform,
-          "data-type": "pcb_soldermask"
-        },
-        value: "",
-        children: []
-      });
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
+          {
+            name: "path",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
+              d: createPillPath(scaledOuterWidth, scaledOuterHeight),
+              transform: outerTransform,
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": copperLayer
+            },
+            value: "",
+            children: []
+          },
+          // 2. Draw the exposed opening in copper color
+          {
+            name: "path",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              d: createPillPath(maskWidth, maskHeight),
+              transform: outerTransform,
+              "data-type": "pcb_soldermask"
+            },
+            value: "",
+            children: []
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original inner hole
+        ];
+      } else {
+        children.unshift({
+          name: "path",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            d: createPillPath(maskWidth, maskHeight),
+            transform: outerTransform,
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": "soldermask-top"
+          },
+          value: "",
+          children: []
+        });
+      }
     }
     return [
       {
@@ -1736,7 +1774,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
     const scaledHoleHeight = hole.hole_diameter * Math.abs(transform.a);
     const outerRadius = Math.min(scaledOuterWidth, scaledOuterHeight) / 2;
     const innerRadius = Math.min(scaledHoleWidth, scaledHoleHeight) / 2;
-    const children = [
+    let children = [
       {
         name: "circle",
         type: "element",
@@ -1770,20 +1808,60 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
     ];
     if (shouldShowSolderMask) {
       const maskRadius = outerRadius + soldermaskMargin;
-      children.push({
-        name: "circle",
-        type: "element",
-        attributes: {
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          cx: x.toString(),
-          cy: y.toString(),
-          r: maskRadius.toString(),
-          "data-type": "pcb_soldermask"
-        },
-        value: "",
-        children: []
-      });
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer ring in soldermask color (covered)
+          {
+            name: "circle",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
+              cx: x.toString(),
+              cy: y.toString(),
+              r: outerRadius.toString(),
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": copperLayer
+            },
+            value: "",
+            children: []
+          },
+          // 2. Draw the exposed opening in copper color
+          {
+            name: "circle",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              cx: x.toString(),
+              cy: y.toString(),
+              r: maskRadius.toString(),
+              "data-type": "pcb_soldermask"
+            },
+            value: "",
+            children: []
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original inner hole
+        ];
+      } else {
+        children.unshift({
+          name: "circle",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            cx: x.toString(),
+            cy: y.toString(),
+            r: maskRadius.toString(),
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": "soldermask-top"
+          },
+          value: "",
+          children: []
+        });
+      }
     }
     return [
       {
@@ -1809,7 +1887,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       h.x + (h.hole_offset_x ?? 0),
       h.y + (h.hole_offset_y ?? 0)
     ]);
-    const children = [
+    let children = [
       // Rectangular pad (outer shape)
       {
         name: "rect",
@@ -1852,25 +1930,75 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
       const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
       const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
-      children.push({
-        name: "rect",
-        type: "element",
-        attributes: {
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          x: (x - maskWidth / 2).toString(),
-          y: (y - maskHeight / 2).toString(),
-          width: maskWidth.toString(),
-          height: maskHeight.toString(),
-          ...scaledRectBorderRadius ? {
-            rx: maskBorderRadius.toString(),
-            ry: maskBorderRadius.toString()
-          } : {},
-          "data-type": "pcb_soldermask"
-        },
-        value: "",
-        children: []
-      });
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
+              x: (x - scaledRectPadWidth / 2).toString(),
+              y: (y - scaledRectPadHeight / 2).toString(),
+              width: scaledRectPadWidth.toString(),
+              height: scaledRectPadHeight.toString(),
+              ...scaledRectBorderRadius ? {
+                rx: scaledRectBorderRadius.toString(),
+                ry: scaledRectBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": copperLayer
+            },
+            value: "",
+            children: []
+          },
+          // 2. Draw the exposed opening in copper color
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (x - maskWidth / 2).toString(),
+              y: (y - maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask"
+            },
+            value: "",
+            children: []
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.unshift({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            x: (x - maskWidth / 2).toString(),
+            y: (y - maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": "soldermask-top"
+          },
+          value: "",
+          children: []
+        });
+      }
     }
     return [
       {
@@ -1900,7 +2028,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       pillHole.y + holeOffsetY
     ]);
     const holeRadius = Math.min(scaledHoleHeight, scaledHoleWidth) / 2;
-    const children = [
+    let children = [
       // Rectangular pad (outer shape)
       {
         name: "rect",
@@ -1946,25 +2074,75 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
       const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
       const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
-      children.push({
-        name: "rect",
-        type: "element",
-        attributes: {
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          x: (x - maskWidth / 2).toString(),
-          y: (y - maskHeight / 2).toString(),
-          width: maskWidth.toString(),
-          height: maskHeight.toString(),
-          ...scaledRectBorderRadius ? {
-            rx: maskBorderRadius.toString(),
-            ry: maskBorderRadius.toString()
-          } : {},
-          "data-type": "pcb_soldermask"
-        },
-        value: "",
-        children: []
-      });
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
+              x: (x - scaledRectPadWidth / 2).toString(),
+              y: (y - scaledRectPadHeight / 2).toString(),
+              width: scaledRectPadWidth.toString(),
+              height: scaledRectPadHeight.toString(),
+              ...scaledRectBorderRadius ? {
+                rx: scaledRectBorderRadius.toString(),
+                ry: scaledRectBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": copperLayer
+            },
+            value: "",
+            children: []
+          },
+          // 2. Draw the exposed opening in copper color
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (x - maskWidth / 2).toString(),
+              y: (y - maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask"
+            },
+            value: "",
+            children: []
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.unshift({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-soldermask-cutout",
+            fill: colorMap2.substrate,
+            x: (x - maskWidth / 2).toString(),
+            y: (y - maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask_opening",
+            "data-pcb-layer": "soldermask-top"
+          },
+          value: "",
+          children: []
+        });
+      }
     }
     return [
       {
@@ -1994,7 +2172,7 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       rotatedHole.y + holeOffsetY
     ]);
     const holeRadius = Math.min(scaledHoleHeight, scaledHoleWidth) / 2;
-    const children = [
+    let children = [
       {
         name: "rect",
         type: "element",
@@ -2040,26 +2218,77 @@ function createSvgObjectsFromPcbPlatedHole(hole, ctx) {
       const maskWidth = scaledRectPadWidth + 2 * soldermaskMargin;
       const maskHeight = scaledRectPadHeight + 2 * soldermaskMargin;
       const maskBorderRadius = scaledRectBorderRadius + soldermaskMargin;
-      children.push({
-        name: "rect",
-        type: "element",
-        attributes: {
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          x: (-maskWidth / 2).toString(),
-          y: (-maskHeight / 2).toString(),
-          width: maskWidth.toString(),
-          height: maskHeight.toString(),
-          transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
-          ...scaledRectBorderRadius ? {
-            rx: maskBorderRadius.toString(),
-            ry: maskBorderRadius.toString()
-          } : {},
-          "data-type": "pcb_soldermask"
-        },
-        value: "",
-        children: []
-      });
+      if (soldermaskMargin < 0) {
+        children = [
+          // 1. Draw the outer pad in soldermask color (covered)
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-covered",
+              fill: solderMaskColor,
+              x: (-scaledRectPadWidth / 2).toString(),
+              y: (-scaledRectPadHeight / 2).toString(),
+              width: scaledRectPadWidth.toString(),
+              height: scaledRectPadHeight.toString(),
+              transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+              ...scaledRectBorderRadius ? {
+                rx: scaledRectBorderRadius.toString(),
+                ry: scaledRectBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_plated_hole",
+              "data-pcb-layer": copperLayer
+            },
+            value: "",
+            children: []
+          },
+          // 2. Draw the exposed opening in copper color
+          {
+            name: "rect",
+            type: "element",
+            attributes: {
+              class: "pcb-hole-outer-exposed",
+              fill: colorMap2.copper.top,
+              x: (-maskWidth / 2).toString(),
+              y: (-maskHeight / 2).toString(),
+              width: maskWidth.toString(),
+              height: maskHeight.toString(),
+              transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+              ...maskBorderRadius > 0 ? {
+                rx: maskBorderRadius.toString(),
+                ry: maskBorderRadius.toString()
+              } : {},
+              "data-type": "pcb_soldermask"
+            },
+            value: "",
+            children: []
+          },
+          // 3. Draw the drill hole on top
+          children[1]
+          // Original hole
+        ];
+      } else {
+        children.push({
+          name: "rect",
+          type: "element",
+          attributes: {
+            class: "pcb-solder-mask",
+            fill: solderMaskColor,
+            x: (-maskWidth / 2).toString(),
+            y: (-maskHeight / 2).toString(),
+            width: maskWidth.toString(),
+            height: maskHeight.toString(),
+            transform: `translate(${x} ${y}) rotate(${-rotatedHole.rect_ccw_rotation})`,
+            ...scaledRectBorderRadius ? {
+              rx: maskBorderRadius.toString(),
+              ry: maskBorderRadius.toString()
+            } : {},
+            "data-type": "pcb_soldermask"
+          },
+          value: "",
+          children: []
+        });
+      }
     }
     return [
       {
@@ -2603,10 +2832,16 @@ var DEFAULT_PCB_COLOR_MAP = {
     inner6: "rgb(255, 105, 180)",
     bottom: "rgb(77, 127, 196)"
   },
-  soldermask: {
+  soldermaskWithCopperUnderneath: {
     top: "rgb(18, 82, 50)",
     bottom: "rgb(77, 127, 196)"
   },
+  soldermask: {
+    top: "rgb(12, 55, 33)",
+    bottom: "rgb(52, 87, 136)"
+  },
+  substrate: "rgb(201, 162, 110)",
+  // FR4 substrate color (tan/beige)
   drill: "#FF26E2",
   silkscreen: {
     top: "#f2eda1",
@@ -2652,7 +2887,7 @@ function createSvgObjectsFromPcbTrace(trace, ctx) {
     if (!layer) continue;
     if (layerFilter && layer !== layerFilter) continue;
     const copperColor = layerNameToColor(layer, colorMap2);
-    const maskColor = colorMap2.soldermask[layer] ?? copperColor;
+    const maskColor = colorMap2.soldermaskWithCopperUnderneath[layer];
     const traceWidth = "width" in start ? start.width : "width" in end ? end.width : null;
     const width = traceWidth ? (traceWidth * Math.abs(transform.a)).toString() : "0.3";
     if (showSolderMask) {
@@ -2725,7 +2960,7 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
   if (layerFilter && pad.layer !== layerFilter) return [];
   const isCoveredWithSolderMask = Boolean(pad?.is_covered_with_solder_mask);
   const shouldshowSolderMask = showSolderMask && isCoveredWithSolderMask;
-  const solderMaskColor = colorMap2.soldermask[pad.layer] ?? colorMap2.soldermask.top;
+  const soldermaskWithCopperUnderneathColor = colorMap2.soldermaskWithCopperUnderneath[pad.layer] ?? colorMap2.soldermaskWithCopperUnderneath.top;
   const soldermaskMargin = (pad.soldermask_margin ?? 0) * Math.abs(transform.a);
   if (pad.shape === "rect" || pad.shape === "rotated_rect") {
     const width = pad.width * Math.abs(transform.a);
@@ -2761,27 +2996,97 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
       const maskWidth2 = width + 2 * soldermaskMargin;
       const maskHeight2 = height + 2 * soldermaskMargin;
       const maskBorderRadius2 = scaledBorderRadius ? scaledBorderRadius + soldermaskMargin : 0;
-      const maskElement2 = {
-        name: padElement2.name,
-        type: padElement2.type,
+      if (soldermaskMargin < 0) {
+        const coveredPadElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-covered",
+            fill: soldermaskWithCopperUnderneathColor,
+            x: (-width / 2).toString(),
+            y: (-height / 2).toString(),
+            width: width.toString(),
+            height: height.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_smtpad",
+            "data-pcb-layer": pad.layer,
+            ...scaledBorderRadius ? {
+              rx: scaledBorderRadius.toString(),
+              ry: scaledBorderRadius.toString()
+            } : {}
+          }
+        };
+        const exposedOpeningElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-exposed",
+            fill: layerNameToColor(pad.layer, colorMap2),
+            x: (-maskWidth2 / 2).toString(),
+            y: (-maskHeight2 / 2).toString(),
+            width: maskWidth2.toString(),
+            height: maskHeight2.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_soldermask",
+            "data-pcb-layer": pad.layer,
+            ...maskBorderRadius2 > 0 ? {
+              rx: maskBorderRadius2.toString(),
+              ry: maskBorderRadius2.toString()
+            } : {}
+          }
+        };
+        return [coveredPadElement, exposedOpeningElement];
+      }
+      if (soldermaskMargin === 0) {
+        const coveredPadElement = {
+          name: "rect",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-pad-covered",
+            fill: soldermaskWithCopperUnderneathColor,
+            x: (-width / 2).toString(),
+            y: (-height / 2).toString(),
+            width: width.toString(),
+            height: height.toString(),
+            transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
+            "data-type": "pcb_smtpad",
+            "data-pcb-layer": pad.layer,
+            ...scaledBorderRadius ? {
+              rx: scaledBorderRadius.toString(),
+              ry: scaledBorderRadius.toString()
+            } : {}
+          }
+        };
+        return [coveredPadElement];
+      }
+      const substrateElement2 = {
+        name: "rect",
+        type: "element",
         value: "",
         children: [],
         attributes: {
-          ...padElement2.attributes,
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          "data-type": "pcb_soldermask",
+          class: "pcb-soldermask-cutout",
+          fill: colorMap2.substrate,
           x: (-maskWidth2 / 2).toString(),
           y: (-maskHeight2 / 2).toString(),
           width: maskWidth2.toString(),
           height: maskHeight2.toString(),
+          transform: `translate(${x} ${y}) rotate(${-pad.ccw_rotation})`,
           ...maskBorderRadius2 > 0 ? {
             rx: maskBorderRadius2.toString(),
             ry: maskBorderRadius2.toString()
-          } : {}
+          } : {},
+          "data-type": "pcb_soldermask_opening",
+          "data-pcb-layer": `soldermask-${pad.layer}`
         }
       };
-      return [padElement2, maskElement2];
+      return [substrateElement2, padElement2];
     }
     const padElement = {
       name: "rect",
@@ -2809,16 +3114,80 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
     const maskWidth = width + 2 * soldermaskMargin;
     const maskHeight = height + 2 * soldermaskMargin;
     const maskBorderRadius = scaledBorderRadius ? scaledBorderRadius + soldermaskMargin : 0;
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer,
+          ...scaledBorderRadius ? {
+            rx: scaledBorderRadius.toString(),
+            ry: scaledBorderRadius.toString()
+          } : {}
+        }
+      };
+      const exposedOpeningElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          x: (x - maskWidth / 2).toString(),
+          y: (y - maskHeight / 2).toString(),
+          width: maskWidth.toString(),
+          height: maskHeight.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer,
+          ...maskBorderRadius > 0 ? {
+            rx: maskBorderRadius.toString(),
+            ry: maskBorderRadius.toString()
+          } : {}
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          ...maskBorderRadius > 0 ? {
+            rx: scaledBorderRadius.toString(),
+            ry: scaledBorderRadius.toString()
+          } : {},
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
         x: (x - maskWidth / 2).toString(),
         y: (y - maskHeight / 2).toString(),
         width: maskWidth.toString(),
@@ -2826,10 +3195,12 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
         ...maskBorderRadius > 0 ? {
           rx: maskBorderRadius.toString(),
           ry: maskBorderRadius.toString()
-        } : {}
+        } : {},
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": `soldermask-${pad.layer}`
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   if (pad.shape === "pill") {
     const width = pad.width * Math.abs(transform.a);
@@ -2857,65 +3228,178 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
     if (!shouldshowSolderMask) {
       return [padElement];
     }
-    const maskWidth = width + 2 * soldermaskMargin;
-    const maskHeight = height + 2 * soldermaskMargin;
-    const maskRadius = radius + soldermaskMargin;
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
-      value: "",
-      children: [],
-      attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
-        x: (x - maskWidth / 2).toString(),
-        y: (y - maskHeight / 2).toString(),
-        width: maskWidth.toString(),
-        height: maskHeight.toString(),
-        rx: maskRadius.toString(),
-        ry: maskRadius.toString()
-      }
-    };
-    return [padElement, maskElement];
-  }
-  if (pad.shape === "circle") {
-    const radius = pad.radius * Math.abs(transform.a);
-    const [x, y] = applyToPoint20(transform, [pad.x, pad.y]);
-    const padElement = {
+    const maskWidth = width + 2 * soldermaskMargin;
+    const maskHeight = height + 2 * soldermaskMargin;
+    const maskRadius = radius + soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          rx: radius.toString(),
+          ry: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      const exposedOpeningElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          x: (x - maskWidth / 2).toString(),
+          y: (y - maskHeight / 2).toString(),
+          width: maskWidth.toString(),
+          height: maskHeight.toString(),
+          rx: maskRadius.toString(),
+          ry: maskRadius.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          x: (x - width / 2).toString(),
+          y: (y - height / 2).toString(),
+          width: width.toString(),
+          height: height.toString(),
+          rx: radius.toString(),
+          ry: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        x: (x - maskWidth / 2).toString(),
+        y: (y - maskHeight / 2).toString(),
+        width: maskWidth.toString(),
+        height: maskHeight.toString(),
+        rx: maskRadius.toString(),
+        ry: maskRadius.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": `soldermask-${pad.layer}`
+      }
+    };
+    return [substrateElement, padElement];
+  }
+  if (pad.shape === "circle") {
+    const radius = pad.radius * Math.abs(transform.a);
+    const [x, y] = applyToPoint20(transform, [pad.x, pad.y]);
+    const padElement = {
+      name: "circle",
+      type: "element",
+      value: "",
+      children: [],
+      attributes: {
+        class: "pcb-pad",
+        fill: layerNameToColor(pad.layer, colorMap2),
+        cx: x.toString(),
+        cy: y.toString(),
+        r: radius.toString(),
+        "data-type": "pcb_smtpad",
+        "data-pcb-layer": pad.layer
+      }
+    };
+    if (!shouldshowSolderMask) {
+      return [padElement];
+    }
+    const maskRadius = radius + soldermaskMargin;
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      const exposedOpeningElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          cx: x.toString(),
+          cy: y.toString(),
+          r: maskRadius.toString(),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "circle",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: radius.toString(),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
       name: "circle",
       type: "element",
       value: "",
       children: [],
       attributes: {
-        class: "pcb-pad",
-        fill: layerNameToColor(pad.layer, colorMap2),
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
         cx: x.toString(),
         cy: y.toString(),
-        r: radius.toString(),
-        "data-type": "pcb_smtpad",
-        "data-pcb-layer": pad.layer
-      }
-    };
-    if (!shouldshowSolderMask) {
-      return [padElement];
-    }
-    const maskRadius = radius + soldermaskMargin;
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
-      value: "",
-      children: [],
-      attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
-        r: maskRadius.toString()
+        r: maskRadius.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": `soldermask-${pad.layer}`
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   if (pad.shape === "polygon") {
     const points = (pad.points ?? []).map(
@@ -2954,20 +3438,65 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
         ];
       });
     }
-    const maskElement = {
-      name: padElement.name,
-      type: padElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredPadElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          points: points.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      const exposedOpeningElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-exposed",
+          fill: layerNameToColor(pad.layer, colorMap2),
+          points: maskPoints.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_soldermask",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement, exposedOpeningElement];
+    }
+    if (soldermaskMargin === 0) {
+      const coveredPadElement = {
+        name: "polygon",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-pad-covered",
+          fill: soldermaskWithCopperUnderneathColor,
+          points: points.map((p) => p.join(",")).join(" "),
+          "data-type": "pcb_smtpad",
+          "data-pcb-layer": pad.layer
+        }
+      };
+      return [coveredPadElement];
+    }
+    const substrateElement = {
+      name: "polygon",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...padElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
-        points: maskPoints.map((p) => p.join(",")).join(" ")
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        points: maskPoints.map((p) => p.join(",")).join(" "),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": `soldermask-${pad.layer}`
       }
     };
-    return [padElement, maskElement];
+    return [substrateElement, padElement];
   }
   return [];
 }
@@ -2975,7 +3504,7 @@ function createSvgObjectsFromSmtPad(pad, ctx) {
 // lib/pcb/svg-object-fns/create-svg-objects-from-pcb-board.ts
 import { applyToPoint as applyToPoint21 } from "transformation-matrix";
 function createSvgObjectsFromPcbBoard(pcbBoard, ctx) {
-  const { transform, colorMap: colorMap2 } = ctx;
+  const { transform, colorMap: colorMap2, showSolderMask } = ctx;
   const { width, height, center, outline } = pcbBoard;
   let path;
   if (outline && Array.isArray(outline) && outline.length >= 3) {
@@ -3005,23 +3534,40 @@ function createSvgObjectsFromPcbBoard(pcbBoard, ctx) {
     path = `M ${topLeft[0]} ${topLeft[1]} L ${topRight[0]} ${topRight[1]} L ${bottomRight[0]} ${bottomRight[1]} L ${bottomLeft[0]} ${bottomLeft[1]}`;
   }
   path += " Z";
-  return [
-    {
+  const svgObjects = [];
+  if (showSolderMask) {
+    svgObjects.push({
       name: "path",
       type: "element",
       value: "",
       children: [],
       attributes: {
-        class: "pcb-board",
+        class: "pcb-board-soldermask",
         d: path,
-        fill: "none",
-        stroke: colorMap2.boardOutline,
-        "stroke-width": (0.1 * Math.abs(transform.a)).toString(),
-        "data-type": "pcb_board",
-        "data-pcb-layer": "board"
+        fill: colorMap2.soldermask.top,
+        "fill-opacity": "0.8",
+        stroke: "none",
+        "data-type": "pcb_soldermask",
+        "data-pcb-layer": "soldermask-top"
       }
+    });
+  }
+  svgObjects.push({
+    name: "path",
+    type: "element",
+    value: "",
+    children: [],
+    attributes: {
+      class: "pcb-board",
+      d: path,
+      fill: "none",
+      stroke: colorMap2.boardOutline,
+      "stroke-width": (0.1 * Math.abs(transform.a)).toString(),
+      "data-type": "pcb_board",
+      "data-pcb-layer": "board"
     }
-  ];
+  });
+  return svgObjects;
 }
 
 // lib/pcb/svg-object-fns/create-svg-objects-from-pcb-panel.ts
@@ -3154,20 +3700,54 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
         return [holeElement2];
       }
       const maskRadius = radius + soldermaskMargin;
-      const maskElement2 = {
-        name: holeElement2.name,
-        type: holeElement2.type,
+      if (soldermaskMargin < 0) {
+        const coveredElement = {
+          name: "circle",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-hole-covered",
+            fill: solderMaskColor,
+            cx: x.toString(),
+            cy: y.toString(),
+            r: radius.toString(),
+            "data-type": "pcb_hole",
+            "data-pcb-layer": "drill"
+          }
+        };
+        const exposedElement = {
+          name: "circle",
+          type: "element",
+          value: "",
+          children: [],
+          attributes: {
+            class: "pcb-hole-exposed",
+            fill: colorMap2.drill,
+            cx: x.toString(),
+            cy: y.toString(),
+            r: maskRadius.toString(),
+            "data-type": "pcb_soldermask"
+          }
+        };
+        return [coveredElement, exposedElement];
+      }
+      const substrateElement2 = {
+        name: "circle",
+        type: "element",
         value: "",
         children: [],
         attributes: {
-          ...holeElement2.attributes,
-          class: "pcb-solder-mask",
-          fill: solderMaskColor,
-          "data-type": "pcb_soldermask",
-          r: maskRadius.toString()
+          class: "pcb-soldermask-cutout",
+          fill: colorMap2.substrate,
+          cx: x.toString(),
+          cy: y.toString(),
+          r: maskRadius.toString(),
+          "data-type": "pcb_soldermask_opening",
+          "data-pcb-layer": "soldermask-top"
         }
       };
-      return [holeElement2, maskElement2];
+      return [substrateElement2, holeElement2];
     }
     const holeElement = {
       name: "rect",
@@ -3189,23 +3769,57 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
       return [holeElement];
     }
     const maskDiameter = scaledDiameter + 2 * soldermaskMargin;
-    const maskElement = {
-      name: holeElement.name,
-      type: holeElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          x: (x - radius).toString(),
+          y: (y - radius).toString(),
+          width: scaledDiameter.toString(),
+          height: scaledDiameter.toString(),
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          x: (x - maskDiameter / 2).toString(),
+          y: (y - maskDiameter / 2).toString(),
+          width: maskDiameter.toString(),
+          height: maskDiameter.toString(),
+          "data-type": "pcb_soldermask"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...holeElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
         x: (x - maskDiameter / 2).toString(),
         y: (y - maskDiameter / 2).toString(),
         width: maskDiameter.toString(),
-        height: maskDiameter.toString()
+        height: maskDiameter.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": "soldermask-top"
       }
     };
-    return [holeElement, maskElement];
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "oval") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -3233,21 +3847,57 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
     }
     const maskRx = rx + soldermaskMargin;
     const maskRy = ry + soldermaskMargin;
-    const maskElement = {
-      name: holeElement.name,
-      type: holeElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "ellipse",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          cx: x.toString(),
+          cy: y.toString(),
+          rx: rx.toString(),
+          ry: ry.toString(),
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "ellipse",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          cx: x.toString(),
+          cy: y.toString(),
+          rx: maskRx.toString(),
+          ry: maskRy.toString(),
+          "data-type": "pcb_soldermask"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "ellipse",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...holeElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        cx: x.toString(),
+        cy: y.toString(),
         rx: maskRx.toString(),
-        ry: maskRy.toString()
+        ry: maskRy.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": "soldermask-top"
       }
     };
-    return [holeElement, maskElement];
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "rect") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -3273,23 +3923,57 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
     }
     const maskWidth = scaledWidth + 2 * soldermaskMargin;
     const maskHeight = scaledHeight + 2 * soldermaskMargin;
-    const maskElement = {
-      name: holeElement.name,
-      type: holeElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          x: (x - scaledWidth / 2).toString(),
+          y: (y - scaledHeight / 2).toString(),
+          width: scaledWidth.toString(),
+          height: scaledHeight.toString(),
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "rect",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          x: (x - maskWidth / 2).toString(),
+          y: (y - maskHeight / 2).toString(),
+          width: maskWidth.toString(),
+          height: maskHeight.toString(),
+          "data-type": "pcb_soldermask"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "rect",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...holeElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
         x: (x - maskWidth / 2).toString(),
         y: (y - maskHeight / 2).toString(),
         width: maskWidth.toString(),
-        height: maskHeight.toString()
+        height: maskHeight.toString(),
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": "soldermask-top"
       }
     };
-    return [holeElement, maskElement];
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "pill") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -3336,20 +4020,48 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
       // Vertical pill (taller than wide)
       `M${x - maskRadius},${y - maskStraightLength / 2} v${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 ${maskWidth},0 v-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 -${maskWidth},0 z`
     );
-    const maskElement = {
-      name: holeElement.name,
-      type: holeElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "path",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          d: pathD,
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "path",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          d: maskPathD,
+          "data-type": "pcb_soldermask"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "path",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...holeElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
-        d: maskPathD
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        d: maskPathD,
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": "soldermask-top"
       }
     };
-    return [holeElement, maskElement];
+    return [substrateElement, holeElement];
   }
   if (hole.hole_shape === "rotated_pill") {
     const scaledWidth = hole.hole_width * Math.abs(transform.a);
@@ -3398,20 +4110,50 @@ function createSvgObjectsFromPcbHole(hole, ctx) {
       // Vertical pill (taller than wide)
       `M${-maskRadius},${-maskStraightLength / 2} v${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 ${maskWidth},0 v-${maskStraightLength} a${maskRadius},${maskRadius} 0 0 0 -${maskWidth},0 z`
     );
-    const maskElement = {
-      name: holeElement.name,
-      type: holeElement.type,
+    if (soldermaskMargin < 0) {
+      const coveredElement = {
+        name: "path",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-covered",
+          fill: solderMaskColor,
+          d: pathD,
+          transform: `translate(${x} ${y}) rotate(${-rotation})`,
+          "data-type": "pcb_hole",
+          "data-pcb-layer": "drill"
+        }
+      };
+      const exposedElement = {
+        name: "path",
+        type: "element",
+        value: "",
+        children: [],
+        attributes: {
+          class: "pcb-hole-exposed",
+          fill: colorMap2.drill,
+          d: maskPathD,
+          transform: `translate(${x} ${y}) rotate(${-rotation})`,
+          "data-type": "pcb_soldermask"
+        }
+      };
+      return [coveredElement, exposedElement];
+    }
+    const substrateElement = {
+      name: "path",
+      type: "element",
       value: "",
       children: [],
       attributes: {
-        ...holeElement.attributes,
-        class: "pcb-solder-mask",
-        fill: solderMaskColor,
-        "data-type": "pcb_soldermask",
-        d: maskPathD
+        class: "pcb-soldermask-cutout",
+        fill: colorMap2.substrate,
+        d: maskPathD,
+        "data-type": "pcb_soldermask_opening",
+        "data-pcb-layer": "soldermask-top"
       }
     };
-    return [holeElement, maskElement];
+    return [substrateElement, holeElement];
   }
   return [];
 }
@@ -4350,7 +5092,7 @@ function getSoftwareUsedString(circuitJson) {
 var package_default = {
   name: "circuit-to-svg",
   type: "module",
-  version: "0.0.276",
+  version: "0.0.278",
   description: "Convert Circuit JSON to SVG",
   main: "dist/index.js",
   files: [
@@ -4411,6 +5153,7 @@ var TYPE_PRIORITY = {
   pcb_copper_pour: 35,
   pcb_via: 36,
   pcb_soldermask: 40,
+  pcb_soldermask_opening: 41,
   pcb_solder_paste: 45,
   pcb_silkscreen_text: 50,
   pcb_silkscreen_path: 50,
@@ -4457,6 +5200,8 @@ function getLayerPriority(layer) {
   if (normalized === "global") return -100;
   if (normalized === "bottom") return 0;
   if (normalized === "board") return 2;
+  if (normalized === "soldermask-top" || normalized === "soldermask-bottom")
+    return 3;
   if (normalized.startsWith("inner")) {
     const match = normalized.match(/\d+/);
     const layerIndex = match ? parseInt(match[0], 10) : 0;
@@ -4547,6 +5292,11 @@ function convertCircuitJsonToPcbSvg(circuitJson, options) {
       top: colorOverrides?.soldermask?.top ?? DEFAULT_PCB_COLOR_MAP.soldermask.top,
       bottom: colorOverrides?.soldermask?.bottom ?? DEFAULT_PCB_COLOR_MAP.soldermask.bottom
     },
+    soldermaskWithCopperUnderneath: {
+      top: colorOverrides?.soldermaskWithCopperUnderneath?.top ?? DEFAULT_PCB_COLOR_MAP.soldermaskWithCopperUnderneath.top,
+      bottom: colorOverrides?.soldermaskWithCopperUnderneath?.bottom ?? DEFAULT_PCB_COLOR_MAP.soldermaskWithCopperUnderneath.bottom
+    },
+    substrate: colorOverrides?.substrate ?? DEFAULT_PCB_COLOR_MAP.substrate,
     courtyard: colorOverrides?.courtyard ?? DEFAULT_PCB_COLOR_MAP.courtyard,
     debugComponent: {
       fill: colorOverrides?.debugComponent?.fill ?? DEFAULT_PCB_COLOR_MAP.debugComponent.fill,