CSS 스케일 SVG 요소에서 필터를 사용하면 필터가 흐리게 생성됩니다.

Question

SVG 요소에 필터가 있으면 FF의 벡터 이미지가 명확하게 렌더링되지 않습니다. Google 크롬 FF 및 예를 참조 :

http://jsfiddle.net/7cuwP/1/

<div id="1"> 
<svg version="1.1" style="width: 150px; height: 50px;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"> 
    <defs> 
    <g id=":m12-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-2.4 -9.9 L1.8 -9.9 1.8 11.75 -2.4 11.75 -2.4 -9.9 Z"/> 
    </g> 
    <g id=":m23-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M0 -6.5 Q2 -6.5 3.65 -5.6 5.3 -4.7 6.25 -3.1 7.25 -1.45 7.3 0.75 7.25 2.95 6.25 4.6 5.3 6.25 3.65 7.15 2 8.05 0 8.05 -2 8.05 -3.65 7.15 -5.3 6.25 -6.25 4.6 -7.25 2.95 -7.25 0.75 -7.25 -1.45 -6.25 -3.1 -5.3 -4.7 -3.65 -5.6 -2 -6.5 0 -6.5 M2.25 -1.55 Q1.35 -2.4 0 -2.4 -1.3 -2.4 -2.25 -1.55 -3.1 -0.7 -3.15 0.75 -3.1 2.25 -2.25 3.1 -1.3 3.95 0 3.95 1.35 3.95 2.25 3.1 3.15 2.25 3.15 0.75 3.15 -0.7 2.25 -1.55"/> 
    </g> 
    <g id=":m24-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M2.6 -1.05 L1.35 -2.2 -0.3 -2.6 -2 -2.2 -3.25 -1.05 Q-3.8 -0.3 -3.8 0.7 L-3.8 0.75 Q-3.8 1.75 -3.25 2.5 L-2 3.65 -0.3 4.05 1.35 3.7 2.6 2.55 Q3.1 1.8 3.1 0.7 3.1 -0.35 2.6 -1.05 M0.25 -6.45 L1.75 -5.85 Q2.55 -5.45 3.1 -4.7 L3.1 -6.25 7.25 -6.25 7.25 7.75 3.1 7.75 3.1 6.15 1.85 7.25 0.35 7.85 -1 8.05 Q-2.8 8 -4.4 7.15 -6.05 6.25 -7.05 4.65 -8.1 3 -8.1 0.75 -8.1 -1.55 -7.05 -3.15 -6.05 -4.8 -4.4 -5.65 -2.8 -6.55 -1 -6.55 L0.25 -6.45"/> 
    </g> 
    <g id=":m25-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-0.4 1.4 Q-1.75 1.45 -2.65 2.3 -3.6 3.2 -3.6 4.75 -3.6 6.3 -2.65 7.25 -1.75 8.15 -0.4 8.15 L1.25 7.7 2.4 6.55 Q2.85 5.75 2.85 4.75 2.85 3.7 2.4 2.95 1.95 2.2 1.2 1.8 0.5 1.4 -0.4 1.4 M1.3 -2 Q2.4 -1.45 2.95 -0.5 L2.95 -9.85 7.1 -9.85 7.1 11.8 2.95 11.8 2.95 10.05 Q2.4 11.05 1.3 11.55 0.2 12.1 -1.15 12.1 -3 12.1 -4.5 11.2 -6.05 10.3 -7 8.7 -7.9 7.05 -7.95 4.85 -7.9 2.55 -7 0.95 -6.05 -0.7 -4.5 -1.6 -3 -2.5 -1.15 -2.5 L1.3 -2"/> 
    </g> 
    <g id=":m26-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.8 -2.8 L1.8 11.2 -2.35 11.2 -2.35 -2.8 1.8 -2.8 M1.55 -9.75 Q2.25 -9.05 2.3 -8 2.25 -6.95 1.55 -6.25 0.8 -5.55 -0.25 -5.55 -1.35 -5.55 -2.1 -6.25 -2.85 -6.95 -2.85 -8 -2.85 -9.05 -2.1 -9.75 -1.35 -10.4 -0.25 -10.45 0.8 -10.4 1.55 -9.75"/> 
    </g> 
    <g id=":m27-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.35 -6.45 Q3.75 -6.45 5.1 -5 6.45 -3.5 6.5 -0.55 L6.5 7.85 5.65 7.85 4.4 7.85 3.15 7.85 2.3 7.85 2.3 0.4 Q2.3 -1.05 1.6 -1.7 0.95 -2.4 -0.15 -2.4 -1.25 -2.45 -1.95 -1.8 -2.7 -1.15 -2.7 0.45 L-2.7 7.85 -6.9 7.85 -6.9 -6.15 -2.7 -6.15 -2.7 -4.15 Q-2.1 -5.2 -1 -5.8 0.1 -6.45 1.35 -6.45 Z"/> 
    </g> 
    <g id=":m28-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.4 -9.75 Q2.55 -9.25 3.1 -8.25 L3.1 -10 7.15 -10 7.15 2.05 Q7.15 6.55 5.05 8.8 3 11 -0.75 11 -3.1 10.95 -4.9 9.8 -6.75 8.65 -7.65 6.65 L-5.95 5.8 -4.3 5 Q-4.05 5.65 -3.45 6.15 L-2.2 6.95 -0.75 7.25 Q0.85 7.2 1.7 6.55 2.6 5.9 2.9 4.8 3.2 3.7 3.1 2.25 L2.1 3.35 Q1.45 3.8 0.65 4.05 L-1.1 4.3 Q-2.9 4.3 -4.5 3.4 -6.05 2.5 -7.05 0.9 -8.05 -0.75 -8.05 -2.95 -8.05 -5.25 -7.05 -6.85 -6.05 -8.5 -4.5 -9.4 -2.9 -10.3 -1.1 -10.3 0.25 -10.3 1.4 -9.75 M3 -3.05 Q3 -4.1 2.55 -4.85 L1.3 -5.95 Q0.5 -6.35 -0.35 -6.35 L-2 -5.95 -3.25 -4.8 Q-3.7 -4.05 -3.7 -3.05 -3.7 -2 -3.25 -1.2 -2.8 -0.45 -2 -0.05 L-0.35 0.4 1.3 -0.05 2.5 -1.25 Q3 -2 3 -3.05"/> 
    </g> 
    </defs> 
    <g> 
    <filter id="18t4a8dd8-2"> 
     <feComponentTransfer color-interpolation-filters="sRGB"> 
     <feFuncA type="linear" intercept="0" slope="1"/> 
     <feFuncR type="linear" intercept="1" slope="0"/> 
     <feFuncG type="linear" intercept="0" slope="1"/> 
     <feFuncB type="linear" intercept="1" slope="0"/> 
     </feComponentTransfer> 
    </filter> 
    <g transform="matrix(1 0 0 1 50 20)" filter="url(#18t4a8dd8-2)"> 
     <g> 
     <use id="s29d1m12" x="0" y="0" xlink:href="#:m12-18svjv0b7" transform="matrix(1 0 0 1 -29.1 -1.25)"></use> 
     <use id="s29d2m23" x="0" y="0" xlink:href="#:m23-18svjv0b7" transform="matrix(1 0 0 1 -17 2.7)"></use> 
     <use id="s29d3m24" x="0" y="0" xlink:href="#:m24-18svjv0b7" transform="matrix(0.9962 -0.0839 0.0781 0.9273 0.55 0.2)"></use> 
     <use id="s29d4m25" x="0" y="0" xlink:href="#:m25-18svjv0b7" transform="matrix(0.9998 0.0179 -0.0179 0.9998 18.75 -2)"></use> 
     <use id="s29d5m26" x="0" y="0" xlink:href="#:m26-18svjv0b7" transform="matrix(1 0 0 1 32 -0.65)"></use> 
     <use id="s29d6m27" x="0" y="0" xlink:href="#:m27-18svjv0b7" transform="matrix(1 0 0 1 44.6 2.65)"></use> 
     <use id="s29d7m28" x="0" y="0" xlink:href="#:m28-18svjv0b7" transform="matrix(1 0 0 1 61.95 6.45)"></use> 
     </g> 
    </g> 
    </g> 
</svg> 
</div> 

<div id="2" style="-webkit-transform: matrix(2,0,0,2,400,50); transform: matrix(2,0,0,2,400,50);"> 
<svg version="1.1" style="width: 150px; height: 100px;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"> 
    <defs> 
    <g id=":m12-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-2.4 -9.9 L1.8 -9.9 1.8 11.75 -2.4 11.75 -2.4 -9.9 Z"/> 
    </g> 
    <g id=":m23-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M0 -6.5 Q2 -6.5 3.65 -5.6 5.3 -4.7 6.25 -3.1 7.25 -1.45 7.3 0.75 7.25 2.95 6.25 4.6 5.3 6.25 3.65 7.15 2 8.05 0 8.05 -2 8.05 -3.65 7.15 -5.3 6.25 -6.25 4.6 -7.25 2.95 -7.25 0.75 -7.25 -1.45 -6.25 -3.1 -5.3 -4.7 -3.65 -5.6 -2 -6.5 0 -6.5 M2.25 -1.55 Q1.35 -2.4 0 -2.4 -1.3 -2.4 -2.25 -1.55 -3.1 -0.7 -3.15 0.75 -3.1 2.25 -2.25 3.1 -1.3 3.95 0 3.95 1.35 3.95 2.25 3.1 3.15 2.25 3.15 0.75 3.15 -0.7 2.25 -1.55"/> 
    </g> 
    <g id=":m24-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M2.6 -1.05 L1.35 -2.2 -0.3 -2.6 -2 -2.2 -3.25 -1.05 Q-3.8 -0.3 -3.8 0.7 L-3.8 0.75 Q-3.8 1.75 -3.25 2.5 L-2 3.65 -0.3 4.05 1.35 3.7 2.6 2.55 Q3.1 1.8 3.1 0.7 3.1 -0.35 2.6 -1.05 M0.25 -6.45 L1.75 -5.85 Q2.55 -5.45 3.1 -4.7 L3.1 -6.25 7.25 -6.25 7.25 7.75 3.1 7.75 3.1 6.15 1.85 7.25 0.35 7.85 -1 8.05 Q-2.8 8 -4.4 7.15 -6.05 6.25 -7.05 4.65 -8.1 3 -8.1 0.75 -8.1 -1.55 -7.05 -3.15 -6.05 -4.8 -4.4 -5.65 -2.8 -6.55 -1 -6.55 L0.25 -6.45"/> 
    </g> 
    <g id=":m25-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-0.4 1.4 Q-1.75 1.45 -2.65 2.3 -3.6 3.2 -3.6 4.75 -3.6 6.3 -2.65 7.25 -1.75 8.15 -0.4 8.15 L1.25 7.7 2.4 6.55 Q2.85 5.75 2.85 4.75 2.85 3.7 2.4 2.95 1.95 2.2 1.2 1.8 0.5 1.4 -0.4 1.4 M1.3 -2 Q2.4 -1.45 2.95 -0.5 L2.95 -9.85 7.1 -9.85 7.1 11.8 2.95 11.8 2.95 10.05 Q2.4 11.05 1.3 11.55 0.2 12.1 -1.15 12.1 -3 12.1 -4.5 11.2 -6.05 10.3 -7 8.7 -7.9 7.05 -7.95 4.85 -7.9 2.55 -7 0.95 -6.05 -0.7 -4.5 -1.6 -3 -2.5 -1.15 -2.5 L1.3 -2"/> 
    </g> 
    <g id=":m26-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.8 -2.8 L1.8 11.2 -2.35 11.2 -2.35 -2.8 1.8 -2.8 M1.55 -9.75 Q2.25 -9.05 2.3 -8 2.25 -6.95 1.55 -6.25 0.8 -5.55 -0.25 -5.55 -1.35 -5.55 -2.1 -6.25 -2.85 -6.95 -2.85 -8 -2.85 -9.05 -2.1 -9.75 -1.35 -10.4 -0.25 -10.45 0.8 -10.4 1.55 -9.75"/> 
    </g> 
    <g id=":m27-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.35 -6.45 Q3.75 -6.45 5.1 -5 6.45 -3.5 6.5 -0.55 L6.5 7.85 5.65 7.85 4.4 7.85 3.15 7.85 2.3 7.85 2.3 0.4 Q2.3 -1.05 1.6 -1.7 0.95 -2.4 -0.15 -2.4 -1.25 -2.45 -1.95 -1.8 -2.7 -1.15 -2.7 0.45 L-2.7 7.85 -6.9 7.85 -6.9 -6.15 -2.7 -6.15 -2.7 -4.15 Q-2.1 -5.2 -1 -5.8 0.1 -6.45 1.35 -6.45 Z"/> 
    </g> 
    <g id=":m28-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.4 -9.75 Q2.55 -9.25 3.1 -8.25 L3.1 -10 7.15 -10 7.15 2.05 Q7.15 6.55 5.05 8.8 3 11 -0.75 11 -3.1 10.95 -4.9 9.8 -6.75 8.65 -7.65 6.65 L-5.95 5.8 -4.3 5 Q-4.05 5.65 -3.45 6.15 L-2.2 6.95 -0.75 7.25 Q0.85 7.2 1.7 6.55 2.6 5.9 2.9 4.8 3.2 3.7 3.1 2.25 L2.1 3.35 Q1.45 3.8 0.65 4.05 L-1.1 4.3 Q-2.9 4.3 -4.5 3.4 -6.05 2.5 -7.05 0.9 -8.05 -0.75 -8.05 -2.95 -8.05 -5.25 -7.05 -6.85 -6.05 -8.5 -4.5 -9.4 -2.9 -10.3 -1.1 -10.3 0.25 -10.3 1.4 -9.75 M3 -3.05 Q3 -4.1 2.55 -4.85 L1.3 -5.95 Q0.5 -6.35 -0.35 -6.35 L-2 -5.95 -3.25 -4.8 Q-3.7 -4.05 -3.7 -3.05 -3.7 -2 -3.25 -1.2 -2.8 -0.45 -2 -0.05 L-0.35 0.4 1.3 -0.05 2.5 -1.25 Q3 -2 3 -3.05"/> 
    </g> 
    </defs> 
    <g> 
    <filter id="18t4a8dd8-2"> 
     <feComponentTransfer color-interpolation-filters="sRGB"> 
     <feFuncA type="linear" intercept="0" slope="1"/> 
     <feFuncR type="linear" intercept="1" slope="0"/> 
     <feFuncG type="linear" intercept="0" slope="1"/> 
     <feFuncB type="linear" intercept="1" slope="0"/> 
     </feComponentTransfer> 
    </filter> 
    <g transform="matrix(1 0 0 1 50 20)" filter="url(#18t4a8dd8-2)"> 
     <g> 
     <use id="s29d1m12" x="0" y="0" xlink:href="#:m12-18svjv0b7" transform="matrix(1 0 0 1 -29.1 -1.25)"></use> 
     <use id="s29d2m23" x="0" y="0" xlink:href="#:m23-18svjv0b7" transform="matrix(1 0 0 1 -17 2.7)"></use> 
     <use id="s29d3m24" x="0" y="0" xlink:href="#:m24-18svjv0b7" transform="matrix(0.9962 -0.0839 0.0781 0.9273 0.55 0.2)"></use> 
     <use id="s29d4m25" x="0" y="0" xlink:href="#:m25-18svjv0b7" transform="matrix(0.9998 0.0179 -0.0179 0.9998 18.75 -2)"></use> 
     <use id="s29d5m26" x="0" y="0" xlink:href="#:m26-18svjv0b7" transform="matrix(1 0 0 1 32 -0.65)"></use> 
     <use id="s29d6m27" x="0" y="0" xlink:href="#:m27-18svjv0b7" transform="matrix(1 0 0 1 44.6 2.65)"></use> 
     <use id="s29d7m28" x="0" y="0" xlink:href="#:m28-18svjv0b7" transform="matrix(1 0 0 1 61.95 6.45)"></use> 
     </g> 
    </g> 
    <g transform="matrix(1 0 0 1 50 50)"> 
     <g> 
     <use id="s29d1m12" x="0" y="0" xlink:href="#:m12-18svjv0b7" transform="matrix(1 0 0 1 -29.1 -1.25)"></use> 
     <use id="s29d2m23" x="0" y="0" xlink:href="#:m23-18svjv0b7" transform="matrix(1 0 0 1 -17 2.7)"></use> 
     <use id="s29d3m24" x="0" y="0" xlink:href="#:m24-18svjv0b7" transform="matrix(0.9962 -0.0839 0.0781 0.9273 0.55 0.2)"></use> 
     <use id="s29d4m25" x="0" y="0" xlink:href="#:m25-18svjv0b7" transform="matrix(0.9998 0.0179 -0.0179 0.9998 18.75 -2)"></use> 
     <use id="s29d5m26" x="0" y="0" xlink:href="#:m26-18svjv0b7" transform="matrix(1 0 0 1 32 -0.65)"></use> 
     <use id="s29d6m27" x="0" y="0" xlink:href="#:m27-18svjv0b7" transform="matrix(1 0 0 1 44.6 2.65)"></use> 
     <use id="s29d7m28" x="0" y="0" xlink:href="#:m28-18svjv0b7" transform="matrix(1 0 0 1 61.95 6.45)"></use> 
     </g> 
    </g> 
    </g> 
</svg> 
</div> 

• 1 번째 요소는 필터가없고
을 CSS는 - 변형되지
• 2 차 소자는 필터와 CSS 변환 형 (배율을 가진다 및
• 3 번째 요소에는 필터가없고 가짐) 번역 CSS-변환 (스케일 및 번역)

FF에서이 버그를 어떻게 수정합니까?

추신 :이 동작은 css-transforms에 의존하지 않습니다.

Answer 1

SVG 필터는 벡터 그래픽을 비트 맵으로 변환합니다. 중첩 계층 구조에서 더 높은 스케일 변환을 적용하면 비트 맵이 확대 된 것처럼 결과가 표시됩니다. 따라서 흐림 효과가 발생합니다.

전에 SVG 변환을 사용하여 SVG 경로를 확장하거나 필터를 적용하는 것과 동시에

이 경우 div 래퍼에 적용된 CSS 변환 눈금을 제거하고 흐릿한 비트 맵 결과없이 요소의 크기를 조정하려면 필터와 같은 요소에있는 변환을 조정하십시오. 다음과 같은

뭔가 :

http://codepen.io/anon/pen/HbzhK?editors=100

<div id="2" > 
<svg version="1.1" style="width: 150px; height: 100px;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"> 
    <defs> 
    <g id=":m12-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-2.4 -9.9 L1.8 -9.9 1.8 11.75 -2.4 11.75 -2.4 -9.9 Z"/> 
    </g> 
    <g id=":m23-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M0 -6.5 Q2 -6.5 3.65 -5.6 5.3 -4.7 6.25 -3.1 7.25 -1.45 7.3 0.75 7.25 2.95 6.25 4.6 5.3 6.25 3.65 7.15 2 8.05 0 8.05 -2 8.05 -3.65 7.15 -5.3 6.25 -6.25 4.6 -7.25 2.95 -7.25 0.75 -7.25 -1.45 -6.25 -3.1 -5.3 -4.7 -3.65 -5.6 -2 -6.5 0 -6.5 M2.25 -1.55 Q1.35 -2.4 0 -2.4 -1.3 -2.4 -2.25 -1.55 -3.1 -0.7 -3.15 0.75 -3.1 2.25 -2.25 3.1 -1.3 3.95 0 3.95 1.35 3.95 2.25 3.1 3.15 2.25 3.15 0.75 3.15 -0.7 2.25 -1.55"/> 
    </g> 
    <g id=":m24-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M2.6 -1.05 L1.35 -2.2 -0.3 -2.6 -2 -2.2 -3.25 -1.05 Q-3.8 -0.3 -3.8 0.7 L-3.8 0.75 Q-3.8 1.75 -3.25 2.5 L-2 3.65 -0.3 4.05 1.35 3.7 2.6 2.55 Q3.1 1.8 3.1 0.7 3.1 -0.35 2.6 -1.05 M0.25 -6.45 L1.75 -5.85 Q2.55 -5.45 3.1 -4.7 L3.1 -6.25 7.25 -6.25 7.25 7.75 3.1 7.75 3.1 6.15 1.85 7.25 0.35 7.85 -1 8.05 Q-2.8 8 -4.4 7.15 -6.05 6.25 -7.05 4.65 -8.1 3 -8.1 0.75 -8.1 -1.55 -7.05 -3.15 -6.05 -4.8 -4.4 -5.65 -2.8 -6.55 -1 -6.55 L0.25 -6.45"/> 
    </g> 
    <g id=":m25-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M-0.4 1.4 Q-1.75 1.45 -2.65 2.3 -3.6 3.2 -3.6 4.75 -3.6 6.3 -2.65 7.25 -1.75 8.15 -0.4 8.15 L1.25 7.7 2.4 6.55 Q2.85 5.75 2.85 4.75 2.85 3.7 2.4 2.95 1.95 2.2 1.2 1.8 0.5 1.4 -0.4 1.4 M1.3 -2 Q2.4 -1.45 2.95 -0.5 L2.95 -9.85 7.1 -9.85 7.1 11.8 2.95 11.8 2.95 10.05 Q2.4 11.05 1.3 11.55 0.2 12.1 -1.15 12.1 -3 12.1 -4.5 11.2 -6.05 10.3 -7 8.7 -7.9 7.05 -7.95 4.85 -7.9 2.55 -7 0.95 -6.05 -0.7 -4.5 -1.6 -3 -2.5 -1.15 -2.5 L1.3 -2"/> 
    </g> 
    <g id=":m26-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.8 -2.8 L1.8 11.2 -2.35 11.2 -2.35 -2.8 1.8 -2.8 M1.55 -9.75 Q2.25 -9.05 2.3 -8 2.25 -6.95 1.55 -6.25 0.8 -5.55 -0.25 -5.55 -1.35 -5.55 -2.1 -6.25 -2.85 -6.95 -2.85 -8 -2.85 -9.05 -2.1 -9.75 -1.35 -10.4 -0.25 -10.45 0.8 -10.4 1.55 -9.75"/> 
    </g> 
    <g id=":m27-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.35 -6.45 Q3.75 -6.45 5.1 -5 6.45 -3.5 6.5 -0.55 L6.5 7.85 5.65 7.85 4.4 7.85 3.15 7.85 2.3 7.85 2.3 0.4 Q2.3 -1.05 1.6 -1.7 0.95 -2.4 -0.15 -2.4 -1.25 -2.45 -1.95 -1.8 -2.7 -1.15 -2.7 0.45 L-2.7 7.85 -6.9 7.85 -6.9 -6.15 -2.7 -6.15 -2.7 -4.15 Q-2.1 -5.2 -1 -5.8 0.1 -6.45 1.35 -6.45 Z"/> 
    </g> 
    <g id=":m28-18svjv0b7"> 
     <path stroke="none" fill="rgb(255,0,255)" d="M1.4 -9.75 Q2.55 -9.25 3.1 -8.25 L3.1 -10 7.15 -10 7.15 2.05 Q7.15 6.55 5.05 8.8 3 11 -0.75 11 -3.1 10.95 -4.9 9.8 -6.75 8.65 -7.65 6.65 L-5.95 5.8 -4.3 5 Q-4.05 5.65 -3.45 6.15 L-2.2 6.95 -0.75 7.25 Q0.85 7.2 1.7 6.55 2.6 5.9 2.9 4.8 3.2 3.7 3.1 2.25 L2.1 3.35 Q1.45 3.8 0.65 4.05 L-1.1 4.3 Q-2.9 4.3 -4.5 3.4 -6.05 2.5 -7.05 0.9 -8.05 -0.75 -8.05 -2.95 -8.05 -5.25 -7.05 -6.85 -6.05 -8.5 -4.5 -9.4 -2.9 -10.3 -1.1 -10.3 0.25 -10.3 1.4 -9.75 M3 -3.05 Q3 -4.1 2.55 -4.85 L1.3 -5.95 Q0.5 -6.35 -0.35 -6.35 L-2 -5.95 -3.25 -4.8 Q-3.7 -4.05 -3.7 -3.05 -3.7 -2 -3.25 -1.2 -2.8 -0.45 -2 -0.05 L-0.35 0.4 1.3 -0.05 2.5 -1.25 Q3 -2 3 -3.05"/> 
    </g> 
    </defs> 
    <g> 
    <filter id="18t4a8dd8-2"> 
     <feComponentTransfer color-interpolation-filters="sRGB"> 
     <feFuncA type="linear" intercept="0" slope="1"/> 
     <feFuncR type="linear" intercept="1" slope="0"/> 
     <feFuncG type="linear" intercept="0" slope="1"/> 
     <feFuncB type="linear" intercept="1" slope="0"/> 
     </feComponentTransfer> 
    </filter> 
    <g transform="matrix(2 0 0 2 50 20)" filter="url(#18t4a8dd8-2)"> 

등