blend mode · layer opacity

Figma blendMode·opacity를 SVG/CSS compositing attrs로 옮깁니다.

데모에서 볼 것

• 두 원 겹침 — 파란 + 주황
• blend select — FIGMA_BLEND_MAP 상위 8종
• opacity 슬라이더 0.2–1
• readout: figma MULTIPLY → mix-blend-mode: …

import {
  figmaBlendModeToSvg,
  figmaLayerCompositingToSvg,
  FIGMA_BLEND_MAP
} from "svg-matrix-core";

figmaLayerCompositingToSvg({ blendMode: "MULTIPLY", opacity: 0.85 });
// { "mix-blend-mode": "multiply", opacity: 0.85 }

FIGMA_BLEND_MAP

PASS_THROUGH → normal, COLOR_DODGE → color-dodge 등 — SVG·CSS 이름 매핑 표.

Core API

관련

• 031 filters · 055 Compositing layer

오늘의 핵심

blend = 레이어 합성 — path geometry와 분리해 export attrs로 처리합니다.