본문 바로가기
svg

svg marker attributes

by peach1227 2023. 12. 24.
<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" xmlns:bx="https://boxy-svg.com">
  <defs>
    <marker id="marker-0" viewBox="0 0 100 100" overflow="visible" orient="auto" refX="50" refY="50" bx:pinned="true">
      <path style="stroke: rgb(0, 0, 0); fill: rgb(186, 38, 38);" d="M 0.937 1.405 L 99.766 50.82 L 1.288 99.649 L 0.937 1.405 Z"></path>
    </marker>
  </defs>
  <path style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0); marker: url(#marker-0); stroke-width: 24px; stroke-opacity: 0.82; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 30; stroke-dashoffset: -37px;" d="M 63.232 276.347 L 375.293 120.609"></path>
</svg>
반응형