<svg viewBox="0 0 400 400"> <style> </style> <defs> <mask id="mask-1"> <path d="M 0 200 A 50 50 0 0 1 100 200 A 50 50 0 0 1 200 200 Q 200 300 102 346 Q 0 300 0 200" fill="#ffffff" transform="translate(100,-50)" /> </mask> </defs> <image href="https://tistory4.daumcdn.net/tistory/6522157/skin/images/Hydrangeas.jpg" x="0" y="0" width="400" height="400" mask="url(#mask-1)"/> </svg>
반응형
'svg' 카테고리의 다른 글
svg viewBox ; a coordinate system (0) | 2023.10.11 |
---|---|
svg mask :using transform attribute 2 (1) | 2023.10.10 |
svg mask with linearGradient and radialGradient (0) | 2023.10.08 |
circulatory system svg in korean (2) | 2023.10.07 |
svg animation transform translate values (1) | 2023.10.05 |