SVG filters 陈旧的LED文字特效

Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch 锈迹斑斑的文本特效。

SVG，过滤器，文本特效

《three.js如何实现贴图模糊效果 - 使用canvas》申请公开！

第三方库
作品简介 1967
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

编译

CSS

body {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 150 150"><filter id="a" x="0" y="0"><feTurbulence baseFrequency=".7" result="fuzz" numOctaves="2" stitchTiles="stitch"/><feComposite in="SourceGraphic" in2="fuzz" operator="arithmetic" k2="1" k3="-.15" k4=".01"/></filter><rect width="102%" height="102%"/><rect x="-1%" y="-1%" width="102%" height="102%" filter="url(#a)"/></svg>');
    width: 100%;
}
.svg-container {
    margin: 0 auto;
    padding: 30px;
}
.svg-container svg {
    width: 100%;
}
#r1,
#e1,
#v,
#e2,
#r2,
#b {
    stroke: #73462d;
    stroke-width: 2;
    filter: url("#rusty");
}
#R1 {
    fill: url("#r-grad3-on");
}
#E1 {
    fill: url("#l-grad1-on");
}
#V {
    fill: url("#l-grad4-on");
}
#E2 {
    fill: url("#r-grad2-on");
}
#R2 {
    fill: url("#r-grad2-on");
}
#B {
    fill: url("#r-grad4-on");
}
.lights {
    filter: url("#lights");
    fill: #f8e81c;
    stroke: #fff;
    stroke-width: 0.5;
}
.off .lights {
    filter: url("#lights-off");
    fill-opacity: 0.55;
    stroke-opacity: 0.14394;
    stroke-width: 0.25;
}
.off .lights circle {
    fill: url("#r-grad-lights-off");
}
.off#E1 {
    fill: url("#l-grad1-off");
}

HTML

<div class="svg-container">
    <svg viewBox="0 0 1234 262" version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" xmlns:sketch="https://www.bohemiancoding.com/sketch/ns">
        
        <title>reverb</title>
        <desc>Created with Sketch.</desc>
        <defs>
            
            <radialGradient id="r-grad2-off" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#605e58; stop-opacity:1" />
                <stop offset="40%" style="stop-color:#823e17; stop-opacity:.70" />
                <stop offset="80%" style="stop-color:#A04A1A; stop-opacity:.9" />
                <stop offset="100%" style="stop-color:#73462d;stop-opacity:1" />
            </radialGradient>
            <radialGradient id="r-grad2-on" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#73462d; stop-opacity:1" />
                <stop offset="40%" style="stop-color:#A04A1A; stop-opacity:.70" />
                <stop offset="80%" style="stop-color:#b35520; stop-opacity:.9" />
                <stop offset="100%" style="stop-color:#823e17;stop-opacity:1" />
            </radialGradient>
            
            <radialGradient id="r-grad3-off" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#A04A1A; stop-opacity:.70" />
                <stop offset="100%" style="stop-color:#723300;stop-opacity:1" />
            </radialGradient>
            <radialGradient id="r-grad3-on" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#b35520; stop-opacity:.70" />
                <stop offset="100%" style="stop-color:#823e17;stop-opacity:1" />
            </radialGradient>
            
            <radialGradient id="r-grad4-off" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#73462d; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#A04A1A;stop-opacity:1" />
            </radialGradient>
            <radialGradient id="r-grad4-on" cx="50%" cy="100%" r="100%" fx="50%" fy="50%">
                <stop offset="0%" style="stop-color:#A04A1A; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#b35520;stop-opacity:1" />
            </radialGradient>
            
            <linearGradient id="l-grad1-off" x1="0%" y1="0%" x2="100%" y2="0%">
                <stop offset="0%" style="stop-color:#73462d; stop-opacity:1" />
                <stop offset="20%" style="stop-color:#945b0a; stop-opacity:1" />
                <stop offset="60%" style="stop-color:#73462d; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#945b0a;stop-opacity:1" />
            </linearGradient>
            <linearGradient id="l-grad1-on" x1="0%" y1="0%" x2="100%" y2="0%">
                <stop offset="0%" style="stop-color:#823e17; stop-opacity:1" />
                <stop offset="20%" style="stop-color:#A04A1A; stop-opacity:1" />
                <stop offset="60%" style="stop-color:#b35520; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#A04A1A;stop-opacity:1" />
            </linearGradient>
            
            <linearGradient id="l-grad4-off" x1="0%" y1="0%" x2="100%" y2="0%">
                <stop offset="0%" style="stop-color:#723300; stop-opacity:1" />
                <stop offset="15%" style="stop-color:#605e58; stop-opacity:1" />
                <stop offset="40%" style="stop-color:#823e17; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#A04A1A;stop-opacity:1" />
            </linearGradient>
            <linearGradient id="l-grad4-on" x1="0%" y1="0%" x2="100%" y2="0%">
                <stop offset="0%" style="stop-color:#823e17; stop-opacity:1" />
                <stop offset="15%" style="stop-color:#73462d; stop-opacity:1" />
                <stop offset="40%" style="stop-color:#A04A1A; stop-opacity:1" />
                <stop offset="100%" style="stop-color:#b35520;stop-opacity:1" />
            </linearGradient>
            
            <radialGradient cx="50%" cy="0%" fx="50%" fy="0%" r="100%" id="r-grad-lights-off">
                <stop stop-color="#FFFFFF" stop-opacity="0.329455389" offset="0%"></stop>
                <stop stop-color="#FEDFC8" stop-opacity="0.135388361" offset="100%"></stop>
            </radialGradient>
            <filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="lights-off">
                <feMorphology radius="3" in="SourceAlpha" operator="dilate" result="shadowSpreadInner1"></feMorphology>
                <feOffset dx="0" dy="1" in="shadowSpreadInner1" result="shadowOffsetInner1"></feOffset>
                <feGaussianBlur stdDeviation="2" in="shadowOffsetInner1" result="shadowBlurInner1"></feGaussianBlur>
                <feComposite in="shadowBlurInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
                <feColorMatrix values="0 0 0 0 0.994658801   0 0 0 0 0.873735274   0 0 0 0 0.783042629  0 0 0 0.154234601 0" in="shadowInnerInner1" type="matrix" result="shadowMatrixInner1"></feColorMatrix>
                <feMerge>
                    <feMergeNode in="SourceGraphic"></feMergeNode>
                    <feMergeNode in="shadowMatrixInner1"></feMergeNode>
                </feMerge>
            </filter>
            
            <filter color-interpolation-filters="sRGB" id="rusty">
                <feGaussianBlur result="result8" stdDeviation="0.01" id="feGaussianBlur4785" />
                <feTurbulence seed="3" result="result7" type="turbulence" numOctaves="5" baseFrequency="0.025 0.028" id="feTurbulence4787" />
                <feColorMatrix result="result5" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 6 -2.4 " id="feColorMatrix4789" />
                <feComposite in2="result7" operator="in" in="result8" result="result6" id="feComposite4791" />
                <feDisplacementMap in2="result6" scale="40" xChannelSelector="R" yChannelSelector="A" in="result5" result="result4" id="feDisplacementMap4793" />
                <feFlood result="result10" flood-opacity=".8" flood-color="rgb(58, 63, 46)" id="feFlood4795" />
                <feComposite in2="result4" operator="in" result="result2" id="feComposite4797" />
                <feComposite in2="result8" operator="in" in="result2" result="result9" id="feComposite4799" />
                <feBlend in2="result8" mode="normal" result="result11" id="feBlend4801" />
                <feBlend in2="result11" mode="multiply" id="feBlend4803" />
            </filter>
            <filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="lights">
                <feMorphology radius="7" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter1"></feMorphology>
                <feOffset dx="-3" dy="-2" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
                <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.901960784   0 0 0 0 0.431372549   0 0 0 0 0.184313725  0 0 0 0.316929914 0" in="shadowBlurOuter1" type="matrix" result="shadowMatrixOuter1"></feColorMatrix>
                <feOffset dx="1" dy="4" in="SourceAlpha" result="shadowOffsetOuter2"></feOffset>
                <feGaussianBlur stdDeviation="5" in="shadowOffsetOuter2" result="shadowBlurOuter2"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.662745118   0 0 0 0 0.396078438   0 0 0 0 0.196078435  0 0 0 0.332840806 0" in="shadowBlurOuter2" type="matrix" result="shadowMatrixOuter2"></feColorMatrix>
                <feMorphology radius="1" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter3"></feMorphology>
                <feOffset dx="1" dy="0" in="shadowSpreadOuter3" result="shadowOffsetOuter3"></feOffset>
                <feGaussianBlur stdDeviation="5" in="shadowOffsetOuter3" result="shadowBlurOuter3"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.662745098   0 0 0 0 0.396078431   0 0 0 0 0.196078431  0 0 0 0.408174819 0" in="shadowBlurOuter3" type="matrix" result="shadowMatrixOuter3"></feColorMatrix>
                <feMorphology radius="5" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter4"></feMorphology>
                <feOffset dx="2" dy="4" in="shadowSpreadOuter4" result="shadowOffsetOuter4"></feOffset>
                <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter4" result="shadowBlurOuter4"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.90196079   0 0 0 0 0.431372553   0 0 0 0 0.184313729  0 0 0 0.165786345 0" in="shadowBlurOuter4" type="matrix" result="shadowMatrixOuter4"></feColorMatrix>
                <feMorphology radius="1" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter5"></feMorphology>
                <feOffset dx="0" dy="2" in="shadowSpreadOuter5" result="shadowOffsetOuter5"></feOffset>
                <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter5" result="shadowBlurOuter5"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.93061756   0 0 0 0 0.305824528   0 0 0 0 0.109644256  0 0 0 0.408174813 0" in="shadowBlurOuter5" type="matrix" result="shadowMatrixOuter5"></feColorMatrix>
                <feMorphology radius="1" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter6"></feMorphology>
                <feOffset dx="0" dy="2" in="shadowSpreadOuter6" result="shadowOffsetOuter6"></feOffset>
                <feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter6" result="shadowBlurOuter6"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.930617571   0 0 0 0 0.305824518   0 0 0 0 0.109644257  0 0 0 0.408174813 0" in="shadowBlurOuter6" type="matrix" result="shadowMatrixOuter6"></feColorMatrix>
                <feMorphology radius="1" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter7"></feMorphology>
                <feOffset dx="0" dy="-2" in="shadowSpreadOuter7" result="shadowOffsetOuter7"></feOffset>
                <feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter7" result="shadowBlurOuter7"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.930617571   0 0 0 0 0.305824518   0 0 0 0 0.109644257  0 0 0 0.237197124 0" in="shadowBlurOuter7" type="matrix" result="shadowMatrixOuter7"></feColorMatrix>
                <feMorphology radius="3" in="SourceAlpha" operator="dilate" result="shadowSpreadOuter8"></feMorphology>
                <feOffset dx="-1" dy="4" in="shadowSpreadOuter8" result="shadowOffsetOuter8"></feOffset>
                <feGaussianBlur stdDeviation="3" in="shadowOffsetOuter8" result="shadowBlurOuter8"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0.753667092   0 0 0 0 0.277228046   0 0 0 0 0.0214109969  0 0 0 0.408174813 0" in="shadowBlurOuter8" type="matrix" result="shadowMatrixOuter8"></feColorMatrix>
                <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter9"></feOffset>
                <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter9" result="shadowBlurOuter9"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.980553985   0 0 0 0 0.736387312  0 0 0 0.322359034 0" in="shadowBlurOuter9" type="matrix" result="shadowMatrixOuter9"></feColorMatrix>
                <feOffset dx="0" dy="-1" in="SourceAlpha" result="shadowOffsetOuter10"></feOffset>
                <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter10" result="shadowBlurOuter10"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.980553996   0 0 0 0 0.736387311  0 0 0 0.322359035 0" in="shadowBlurOuter10" type="matrix" result="shadowMatrixOuter10"></feColorMatrix>
                <feOffset dx="1" dy="0" in="SourceAlpha" result="shadowOffsetOuter11"></feOffset>
                <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter11" result="shadowBlurOuter11"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.980553985   0 0 0 0 0.736387312  0 0 0 0.322359034 0" in="shadowBlurOuter11" type="matrix" result="shadowMatrixOuter11"></feColorMatrix>
                <feOffset dx="-1" dy="0" in="SourceAlpha" result="shadowOffsetOuter12"></feOffset>
                <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter12" result="shadowBlurOuter12"></feGaussianBlur>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.980553985   0 0 0 0 0.736387312  0 0 0 0.322359034 0" in="shadowBlurOuter12" type="matrix" result="shadowMatrixOuter12"></feColorMatrix>
                <feMorphology radius="3" in="SourceAlpha" operator="dilate" result="shadowSpreadInner1"></feMorphology>
                <feOffset dx="0" dy="1" in="shadowSpreadInner1" result="shadowOffsetInner1"></feOffset>
                <feGaussianBlur stdDeviation="2" in="shadowOffsetInner1" result="shadowBlurInner1"></feGaussianBlur>
                <feComposite in="shadowBlurInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.992794704   0 0 0 0 0.902324021  0 0 0 0.7 0" in="shadowInnerInner1" type="matrix" result="shadowMatrixInner1"></feColorMatrix>
                <feOffset dx="-1" dy="1" in="SourceAlpha" result="shadowOffsetInner2"></feOffset>
                <feGaussianBlur stdDeviation="0.5" in="shadowOffsetInner2" result="shadowBlurInner2"></feGaussianBlur>
                <feComposite in="shadowBlurInner2" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner2"></feComposite>
                <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.96144126   0 0 0 0 0.477292456  0 0 0 0.7 0" in="shadowInnerInner2" type="matrix" result="shadowMatrixInner2"></feColorMatrix>
                <feMerge>
                    <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter2"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter3"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter4"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter5"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter6"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter7"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter8"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter9"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter10"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter11"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter12"></feMergeNode>
                    <feMergeNode in="SourceGraphic"></feMergeNode>
                    <feMergeNode in="shadowMatrixInner1"></feMergeNode>
                    <feMergeNode in="shadowMatrixInner2"></feMergeNode>
                </feMerge>
            </filter>
        </defs>
        <g id="Page-1" stroke="none" sketch:type="MSPage">
            <g id="reverb" sketch:type="MSLayerGroup" transform="translate(3.000000, 2.000000)" stroke-linecap="square">
                <g id="R1" transform="translate(843.702489, 0.000000)" sketch:type="MSShapeGroup">
                    <path d="M96.899095,247.217304 L0.168778281,247.217304 L0.168778281,219.84308 C4.97932127,219.84308 9.47633484,220.219268 13.9288235,219.770449 C26.1193665,218.545043 27.9411765,215.893101 28.0970136,199.338949 C28.2305882,185.071725 28.1378281,170.800775 28.1396833,156.529826 C28.1415385,122.715703 28.1433937,88.9015797 28.1341176,55.0893188 C28.1322624,51.6775507 28.1396833,48.2601957 27.9968326,44.8558768 C27.4940724,32.9500725 25.2270136,29.6127971 16.3888235,28.8399348 C11.2276471,28.3892536 6.02936652,28.7579928 0.319049774,28.7579928 C0.319049774,18.8411449 0.319049774,10.1869492 0.319049774,1.08579708 C5.13902075,1.08579713 80.5250679,-0.0278695652 118.148597,1.0857971 C129.036787,1.40797826 140.323846,4.56088406 150.612805,9.55934783 C182.431403,25.0165942 180.431493,82.4523696 161.436063,103.120384 C153.193394,112.089312 143.956335,117.212551 133.804661,119.925949 C131.609955,120.51258 129.43009,121.205362 125.567557,122.341377 C130.589593,124.402964 134.07552,125.682377 137.489095,127.263486 C150.087783,133.103717 157.566109,144.651957 158.62914,163.213688 C159.371222,176.199638 160.070633,189.189312 160.853529,202.169674 C161.03905,205.251812 161.293213,208.369333 161.844208,211.358355 C162.705023,216.029051 164.858914,218.889572 168.602715,218.939855 C172.38733,218.990138 174.715611,216.174312 175.266606,211.391877 C176.003122,204.989225 176.30552,198.478558 176.583801,191.997688 C176.778597,187.446181 176.620905,182.864877 176.620905,177.914833 L194.022715,177.914833 C193.968914,196.605065 195.082036,215.096029 188.817014,232.493812 C188.716833,232.771297 188.633348,233.061819 188.525747,233.333717 C181.568733,250.900971 167.107421,258.352109 148.130543,254.15258 C134.62095,251.163558 124.955339,238.084493 123.016652,218.785283 C121.940633,208.073225 122.233756,197.117203 121.536199,186.317616 C120.901719,176.467812 120.256109,166.530478 118.72371,156.898565 C116.825837,144.977862 111.061719,136.770623 102.210543,134.871058 C90.6693213,132.396036 78.4472409,130.936904 66.4774671,129.245918 C66.1008608,133.31136 66.2529864,135.826428 66.2548416,137.893601 C66.2641176,158.67708 66.0526244,179.471732 66.4774661,200.240312 C66.8002715,215.993667 68.7296833,218.431442 80.0965158,219.617739 C85.4710407,220.176435 90.9012217,219.712717 96.899095,219.712717 L96.899095,247.217304 Z M66.6425792,27.4785797 L66.6425792,102.470435 C68.5497285,102.679014 70.0914027,103.019819 71.6293665,102.990022 C83.860724,102.753507 96.0957919,102.597072 108.321584,102.055138 C111.442036,101.917326 114.610724,100.846493 117.623575,99.5968768 C130.216697,94.3767971 136.073575,81.9718913 135.286968,62.6596449 C134.535611,44.237587 128.226063,32.6707246 115.135747,30.7320507 C99.2347964,28.3762174 83.1371946,28.4711957 66.6425792,27.4785797 L66.6425792,27.4785797 Z"
                    id="r1"></path>
                    <g class="lights" transform="translate(13.000000, 10.000000)">
                        <circle id="Path" cx="5" cy="220" r="5"></circle>
                        <circle id="Path" cx="63" cy="220" r="5"></circle>
                        <circle id="Path" cx="34" cy="220" r="5"></circle>
                        <circle id="Path" cx="34" cy="189" r="5"></circle>
                        <circle id="Path" cx="34" cy="158" r="5"></circle>
                        <circle id="Path" cx="34" cy="132" r="5"></circle>
                        <circle id="Path" cx="34" cy="106" r="5"></circle>
                        <circle id="Path" cx="63" cy="106" r="5"></circle>
                        <circle id="Path" cx="172" cy="184" r="5"></circle>
                        <circle id="Path" cx="169" cy="210" r="5"></circle>
                        <circle id="Path" cx="148" cy="225" r="5"></circle>
                        <circle id="Path" cx="132" cy="212" r="5"></circle>
                        <circle id="Path" cx="128" cy="184" r="5"></circle>
                        <circle id="Path" cx="127" cy="156" r="5"></circle>
                        <circle id="Path" cx="115" cy="132" r="5"></circle>
                        <circle id="Path" cx="92" cy="104" r="5"></circle>
                        <circle id="Path" cx="120" cy="94" r="5"></circle>
                        <circle id="Path" cx="138" cy="75" r="5"></circle>
                        <circle id="Path" cx="143" cy="44" r="5"></circle>
                        <circle id="Path" cx="130" cy="16" r="5"></circle>
                        <circle id="Path" cx="101" cy="6" r="5"></circle>
                        <circle id="Path" cx="68" cy="5" r="5"></circle>
                        <circle id="Path" cx="35" cy="80" r="5"></circle>
                        <circle id="Path" cx="36" cy="54" r="5"></circle>
                        <circle id="Path" cx="35" cy="28" r="5"></circle>
                        <circle id="Path" cx="35" cy="5" r="5"></circle>
                        <circle id="Path" cx="5" cy="5" r="5"></circle>
                    </g>
                </g>
                <g id="E1" class="off" transform="translate(215.000000, 3.000000)" sketch:type="MSShapeGroup">
                    <path d="M0.737873303,27.4041522 L0.737873303,0.0615869565 L177.807783,0.0615869565 L177.807783,97.0045942 L158.615701,97.0045942 C157.116697,84.1992899 156.066652,71.9135725 154.178054,59.8736812 C151.276516,41.3901667 142.724027,29.7246014 128.835973,28.9964348 C108.49181,27.9311884 88.0938462,28.7226739 67.2209502,28.7226739 L67.2209502,102.902558 C77.6898643,103.090652 104.874163,103.219152 104.874163,103.219152 L104.562489,131.621377 C89.5279186,131.654899 72.148371,131.910036 67.1875566,131.910036 L67.1875566,217.45379 C67.6587783,217.928681 106.887059,218.556283 126.127376,217.671681 C139.084118,217.075739 147.983529,207.365609 151.515837,190.347739 C154.101991,177.888826 155.36724,164.912188 157.144525,152.145993 C157.56009,149.155109 157.663982,146.08042 157.96267,142.417239 L177.909819,142.417239 L177.909819,246.321594 L0.62841629,246.321594 L0.62841629,219.666225 C5.62447964,219.312384 10.7374208,219.185746 15.8151131,218.541384 C26.4528507,217.189341 28.3562896,214.83537 28.4286425,200.046696 C28.6531222,155.358493 28.5733484,110.668428 28.5752036,65.9783623 C28.5752036,57.9145217 28.6197285,49.8283333 28.231991,41.7887029 C27.7663348,32.140029 25.6959276,29.3502754 18.6851131,28.1025217 C15.7705882,27.5829348 12.8059729,27.5363768 9.86176471,27.4265 C6.96022624,27.3184855 4.05683258,27.4041522 0.737873303,27.4041522 L0.737873303,27.4041522 Z"
                    id="e1"></path>
                    <g class="lights" transform="translate(9.000000, 9.000000)">
                        <circle id="Path-2" cx="5" cy="5" r="5"></circle>
                        <circle id="Path-4" cx="39" cy="5" r="5"></circle>
                        <circle id="Path-10" cx="39" cy="40" r="5"></circle>
                        <circle id="Path-11" cx="39" cy="72" r="5"></circle>
                        <circle id="Path-12" cx="39" cy="107" r="5"></circle>
                        <circle id="Path-13" cx="85" cy="107" r="5"></circle>
                        <circle id="Path-19" cx="62" cy="107" r="5"></circle>
                        <circle id="Path-14" cx="39" cy="147" r="5"></circle>
                        <circle id="Path-15" cx="39" cy="183" r="5"></circle>
                        <circle id="Path-16" cx="39" cy="224" r="5"></circle>
                        <circle id="Path-18" cx="77" cy="224" r="5"></circle>
                        <circle id="Path-20" cx="120" cy="224" r="5"></circle>
                        <circle id="Path-21" cx="158" cy="224" r="5"></circle>
                        <circle id="Path-22" cx="158" cy="185" r="5"></circle>
                        <circle id="Path-23" cx="158" cy="147" r="5"></circle>
                        <circle id="Path-17" cx="5" cy="224" r="5"></circle>
                        <circle id="Path-5" cx="77" cy="5" r="5"></circle>
                        <circle id="Path-6" cx="120" cy="5" r="5"></circle>
                        <circle id="Path-8" cx="158" cy="5" r="5"></circle>
                        <circle id="Path-9" cx="158" cy="41" r="5"></circle>
                        <circle id="Path-24" cx="158" cy="77" r="5"></circle>
                    </g>
                </g>
                <g id="V" transform="translate(414.000000, 3.000000)" sketch:type="MSShapeGroup">
                    <path d="M199.313575,27.0707971 C191.981809,27.5773475 193.14657,27.6201808 190.736661,27.5773475 C180.776072,27.4004272 175.993665,34.3897101 172.630181,46.8523478 C166.120271,70.982413 159.400724,95.0081884 152.779502,119.082384 C141.689095,159.399725 130.609819,199.722652 119.513846,240.036268 C118.962851,242.036399 118.300543,243.978797 117.558462,246.371877 L80.46181,246.371877 C79.751267,244.176203 78.8273756,241.766362 78.1687783,239.228022 C62.7038009,179.654304 47.2666516,120.065688 31.8239367,60.4826594 C31.4454751,59.0207391 31.0431265,57.5710416 30.67,56.1080725 C23.3933114,27.5773475 0.508099547,27.5773475 0.508099547,27.5773475 C0.508099547,27.5773475 0.508099548,8.32283333 0.508099548,0.139804348 L95.1939819,0.139804348 L95.1939819,27.595971 C89.9734389,27.595971 84.8549321,27.4153261 79.7475566,27.6332174 C68.3343439,28.1192826 65.0803167,33.4343406 68.6627149,48.1652826 C76.1670136,79.0350797 84.2909502,109.623667 92.1996833,140.309094 C95.8080543,154.310007 99.5036199,168.269949 103.575792,183.837072 C104.822489,180.650645 128.472624,95.4216232 139.442443,54.7131957 C140.68543,50.1002319 141.696516,45.2488913 142.156606,40.3919638 C142.900543,32.519942 141.190045,29.6016884 135.372127,28.4321522 C131.802715,27.7151594 128.144253,27.7412319 124.522896,27.6034203 C121.168688,27.4767826 117.810769,27.5773478 114.009457,27.5773478 L114.009457,0.227333333 L199.313575,0.227333333 L199.313575,27.0707971 Z"
                    id="v"></path>
                    <g class="lights" transform="translate(7.000000, 9.000000)">
                        <circle id="Path-3" cx="5" cy="5" r="5"></circle>
                        <circle id="Path-7" cx="77" cy="5" r="5"></circle>
                        <circle id="Path-25" cx="37" cy="5" r="5"></circle>
                        <circle id="Path-26" cx="42" cy="37" r="5"></circle>
                        <circle id="Path-27" cx="52" cy="73" r="5"></circle>
                        <circle id="Path-28" cx="62" cy="107" r="5"></circle>
                        <circle id="Path-29" cx="72" cy="144" r="5"></circle>
                        <circle id="Path-30" cx="82" cy="185" r="5"></circle>
                        <circle id="Path-31" cx="92" cy="224" r="5"></circle>
                        <circle id="Path-32" cx="109" cy="185" r="5"></circle>
                        <circle id="Path-34" cx="119" cy="144" r="5"></circle>
                        <circle id="Path-35" cx="129" cy="107" r="5"></circle>
                        <circle id="Path-36" cx="139" cy="73" r="5"></circle>
                        <circle id="Path-37" cx="149" cy="37" r="5"></circle>
                        <circle id="Path-38" cx="117" cy="5" r="5"></circle>
                        <circle id="Path-39" cx="180" cy="5" r="5"></circle>
                        <circle id="Path-40" cx="153" cy="6" r="5"></circle>
                        <circle id="Path-33" cx="92" cy="224" r="5"></circle>
                    </g>
                </g>
                <g id="E2" transform="translate(630.251854, 3.000000)" sketch:type="MSShapeGroup">
                    <path d="M0.737873303,27.4041522 L0.737873303,0.0615869565 L177.807783,0.0615869565 L177.807783,97.0045942 L158.615701,97.0045942 C157.116697,84.1992899 156.066652,71.9135725 154.178054,59.8736812 C151.276516,41.3901667 142.724027,29.7246014 128.835973,28.9964348 C108.49181,27.9311884 88.0938462,28.7226739 67.2209502,28.7226739 L67.2209502,102.902558 C77.6898643,103.090652 104.874163,103.219152 104.874163,103.219152 L104.562489,131.621377 C89.5279186,131.654899 72.148371,131.910036 67.1875566,131.910036 L67.1875566,217.45379 C67.6587783,217.928681 106.887059,218.556283 126.127376,217.671681 C139.084118,217.075739 147.983529,207.365609 151.515837,190.347739 C154.101991,177.888826 155.36724,164.912188 157.144525,152.145993 C157.56009,149.155109 157.663982,146.08042 157.96267,142.417239 L177.909819,142.417239 L177.909819,246.321594 L0.62841629,246.321594 L0.62841629,219.666225 C5.62447964,219.312384 10.7374208,219.185746 15.8151131,218.541384 C26.4528507,217.189341 28.3562896,214.83537 28.4286425,200.046696 C28.6531222,155.358493 28.5733484,110.668428 28.5752036,65.9783623 C28.5752036,57.9145217 28.6197285,49.8283333 28.231991,41.7887029 C27.7663348,32.140029 25.6959276,29.3502754 18.6851131,28.1025217 C15.7705882,27.5829348 12.8059729,27.5363768 9.86176471,27.4265 C6.96022624,27.3184855 4.05683258,27.4041522 0.737873303,27.4041522 L0.737873303,27.4041522 Z"
                    id="e2"></path>
                    <g class="lights" transform="translate(9.000000, 9.000000)">
                        <circle id="Path-2" cx="5" cy="5" r="5"></circle>
                        <circle id="Path-4" cx="39" cy="5" r="5"></circle>
                        <circle id="Path-10" cx="39" cy="40" r="5"></circle>
                        <circle id="Path-11" cx="39" cy="72" r="5"></circle>
                        <circle id="Path-12" cx="39" cy="107" r="5"></circle>
                        <circle id="Path-13" cx="85" cy="107" r="5"></circle>
                        <circle id="Path-19" cx="62" cy="107" r="5"></circle>
                        <circle id="Path-14" cx="39" cy="147" r="5"></circle>
                        <circle id="Path-15" cx="39" cy="183" r="5"></circle>
                        <circle id="Path-16" cx="39" cy="224" r="5"></circle>
                        <circle id="Path-18" cx="77" cy="224" r="5"></circle>
                        <circle id="Path-20" cx="120" cy="224" r="5"></circle>
                        <circle id="Path-21" cx="158" cy="224" r="5"></circle>
                        <circle id="Path-22" cx="158" cy="185" r="5"></circle>
                        <circle id="Path-23" cx="158" cy="147" r="5"></circle>
                        <circle id="Path-17" cx="5" cy="224" r="5"></circle>
                        <circle id="Path-5" cx="77" cy="5" r="5"></circle>
                        <circle id="Path-6" cx="120" cy="5" r="5"></circle>
                        <circle id="Path-8" cx="158" cy="5" r="5"></circle>
                        <circle id="Path-9" cx="158" cy="41" r="5"></circle>
                        <circle id="Path-24" cx="158" cy="77" r="5"></circle>
                    </g>
                </g>
                <g id="R2" transform="translate(0.000000, 2.000000)" sketch:type="MSShapeGroup">
                    <path d="M96.899095,247.217304 L0.168778281,247.217304 L0.168778281,219.84308 C4.97932127,219.84308 9.47633484,220.219268 13.9288235,219.770449 C26.1193665,218.545043 27.9411765,215.893101 28.0970136,199.338949 C28.2305882,185.071725 28.1378281,170.800775 28.1396833,156.529826 C28.1415385,122.715703 28.1433937,88.9015797 28.1341176,55.0893188 C28.1322624,51.6775507 28.1396833,48.2601957 27.9968326,44.8558768 C27.4940724,32.9500725 25.2270136,29.6127971 16.3888235,28.8399348 C11.2276471,28.3892536 6.02936652,28.7579928 0.319049774,28.7579928 C0.319049774,18.8411449 0.319049774,10.1869492 0.319049774,1.08579708 C5.13902075,1.08579713 80.5250679,-0.0278695652 118.148597,1.0857971 C129.036787,1.40797826 140.323846,4.56088406 150.612805,9.55934783 C182.431403,25.0165942 180.431493,82.4523696 161.436063,103.120384 C153.193394,112.089312 143.956335,117.212551 133.804661,119.925949 C131.609955,120.51258 129.43009,121.205362 125.567557,122.341377 C130.589593,124.402964 134.07552,125.682377 137.489095,127.263486 C150.087783,133.103717 157.566109,144.651957 158.62914,163.213688 C159.371222,176.199638 160.070633,189.189312 160.853529,202.169674 C161.03905,205.251812 161.293213,208.369333 161.844208,211.358355 C162.705023,216.029051 164.858914,218.889572 168.602715,218.939855 C172.38733,218.990138 174.715611,216.174312 175.266606,211.391877 C176.003122,204.989225 176.30552,198.478558 176.583801,191.997688 C176.778597,187.446181 176.620905,182.864877 176.620905,177.914833 L194.022715,177.914833 C193.968914,196.605065 195.082036,215.096029 188.817014,232.493812 C188.716833,232.771297 188.633348,233.061819 188.525747,233.333717 C181.568733,250.900971 167.107421,258.352109 148.130543,254.15258 C134.62095,251.163558 124.955339,238.084493 123.016652,218.785283 C121.940633,208.073225 122.233756,197.117203 121.536199,186.317616 C120.901719,176.467812 120.256109,166.530478 118.72371,156.898565 C116.825837,144.977862 111.061719,136.770623 102.210543,134.871058 C90.6693213,132.396036 78.4472409,130.936904 66.4774671,129.245918 C66.1008608,133.31136 66.2529864,135.826428 66.2548416,137.893601 C66.2641176,158.67708 66.0526244,179.471732 66.4774661,200.240312 C66.8002715,215.993667 68.7296833,218.431442 80.0965158,219.617739 C85.4710407,220.176435 90.9012217,219.712717 96.899095,219.712717 L96.899095,247.217304 Z M66.6425792,27.4785797 L66.6425792,102.470435 C68.5497285,102.679014 70.0914027,103.019819 71.6293665,102.990022 C83.860724,102.753507 96.0957919,102.597072 108.321584,102.055138 C111.442036,101.917326 114.610724,100.846493 117.623575,99.5968768 C130.216697,94.3767971 136.073575,81.9718913 135.286968,62.6596449 C134.535611,44.237587 128.226063,32.6707246 115.135747,30.7320507 C99.2347964,28.3762174 83.1371946,28.4711957 66.6425792,27.4785797 L66.6425792,27.4785797 Z"
                    id="r2"></path>
                    <g class="lights" transform="translate(13.000000, 10.000000)">
                        <circle id="Path" cx="5" cy="220" r="5"></circle>
                        <circle id="Path" cx="63" cy="220" r="5"></circle>
                        <circle id="Path" cx="34" cy="220" r="5"></circle>
                        <circle id="Path" cx="34" cy="179" r="5"></circle>
                        <circle id="Path" cx="34" cy="146" r="5"></circle>
                        <circle id="Path" cx="35" cy="109" r="5"></circle>
                        <circle id="Path" cx="63" cy="106" r="5"></circle>
                        <circle id="Path" cx="172" cy="184" r="5"></circle>
                        <circle id="Path" cx="169" cy="210" r="5"></circle>
                        <circle id="Path" cx="147" cy="225" r="5"></circle>
                        <circle id="Path" cx="130" cy="200" r="5"></circle>
                        <circle id="Path" cx="127" cy="169" r="5"></circle>
                        <circle id="Path" cx="117" cy="136" r="5"></circle>
                        <circle id="Path" cx="91" cy="106" r="5"></circle>
                        <circle id="Path" cx="132" cy="83" r="5"></circle>
                        <circle id="Path" cx="142" cy="48" r="5"></circle>
                        <circle id="Path" cx="130" cy="16" r="5"></circle>
                        <circle id="Path" cx="101" cy="6" r="5"></circle>
                        <circle id="Path" cx="68" cy="5" r="5"></circle>
                        <circle id="Path" cx="34" cy="75" r="5"></circle>
                        <circle id="Path" cx="34" cy="38" r="5"></circle>
                        <circle id="Path" cx="35" cy="5" r="5"></circle>
                        <circle id="Path" cx="5" cy="5" r="5"></circle>
                    </g>
                </g>
                <g id="B" transform="translate(1049.000000, 2.000000)" sketch:type="MSShapeGroup">
                    <path d="M0.640769231,1.17332608 C3.49023883,1.17332609 78.7021719,-0.106086957 115.418507,1.17332609 C126.492217,1.55882609 138.120633,5.01342754 148.357647,10.8126884 C173.191403,24.8806449 180.482353,72.7571377 162.075023,98.0250797 C157.470407,104.347652 150.70819,107.785493 144.825339,112.269957 C142.74009,113.858514 140.315339,114.618341 136.501041,116.52908 C141.474842,118.698681 144.983032,120.149428 148.452262,121.752884 C168.924434,131.211601 179.59371,152.429 179.144751,182.717754 C178.695792,213.054928 167.638778,234.447384 146.584072,241.533507 C134.595747,245.56729 121.959955,247.358841 109.585747,247.636326 C74.6689593,248.424087 5.8799003,247.884017 0.640769231,247.884017 C0.640769231,239.229821 0.930180995,230.24413 0.930180995,220.677399 C6.29542986,220.267688 11.8591855,220.107529 17.3802715,219.358877 C26.2481448,218.157681 28.5634389,215.254326 28.6079638,202.907152 C28.7953394,150.47729 28.8064706,98.0437029 28.6172398,45.6119783 C28.5690045,32.6353406 25.8622624,29.4247029 16.2207692,28.7281957 C11.2840724,28.3724928 6.32511312,28.6667391 0.640769231,28.6667391 L0.640769231,1.17332608 Z M67.3724434,132.409072 L67.3724434,221.366457 C84.3123077,220.183884 100.907104,220.55821 117.149412,217.453725 C132.820317,214.457254 139.875656,199.746797 139.838552,176.674529 C139.803303,154.928232 131.957647,139.094797 117.186516,136.431681 C100.910814,133.496667 84.3401357,133.64379 67.3724434,132.409072 Z M67.3557466,106.364543 C83.2047511,105.301159 98.3803167,105.314196 113.357376,102.963949 C126.169412,100.952645 133.647738,86.642587 133.807285,67.9430435 C133.977964,47.6474928 127.314072,33.3690942 114.323937,31.212529 C98.948009,28.6592899 83.3420362,28.7319203 67.3557466,27.6350145 L67.3557466,106.364543 Z"
                    id="b"></path>
                    <g class="lights" id="lights" transform="translate(7.000000, 8.000000)">
                        <circle id="Path-41" cx="5" cy="6" r="5"></circle>
                        <circle id="Path-42" cx="39" cy="6" r="5"></circle>
                        <circle id="Path-43" cx="39" cy="42" r="5"></circle>
                        <circle id="Path-44" cx="39" cy="78" r="5"></circle>
                        <circle id="Path-45" cx="40" cy="112" r="5"></circle>
                        <circle id="Path-47" cx="40" cy="153" r="5"></circle>
                        <circle id="Path-48" cx="40" cy="194" r="5"></circle>
                        <circle id="Path-49" cx="5" cy="226" r="5"></circle>
                        <circle id="Path-50" cx="40" cy="226" r="5"></circle>
                        <circle id="Path-51" cx="84" cy="226" r="5"></circle>
                        <circle id="Path-52" cx="144" cy="210" r="5"></circle>
                        <circle id="Path-62" cx="119" cy="221" r="5"></circle>
                        <circle id="Path-53" cx="153" cy="184" r="5"></circle>
                        <circle id="Path-54" cx="149" cy="153" r="5"></circle>
                        <circle id="Path-55" cx="128" cy="121" r="5"></circle>
                        <circle id="Path-56" cx="128" cy="93" r="5"></circle>
                        <circle id="Path-57" cx="144" cy="68" r="5"></circle>
                        <circle id="Path-58" cx="144" cy="37" r="5"></circle>
                        <circle id="Path-59" cx="129" cy="16" r="5"></circle>
                        <circle id="Path-60" cx="73" cy="5" r="5"></circle>
                        <circle id="Path-61" cx="104" cy="6" r="5"></circle>
                        <circle id="Path-46" cx="74" cy="111" r="5"></circle>
                        <circle id="Path-63" cx="108" cy="111" r="5"></circle>
                    </g>
                </g>
            </g>
        </g>
    </svg>
</div>

Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch 锈迹斑斑的文本特效。

SVG，过滤器，文本特效

编辑器支持Emmet

快捷键

Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch 锈迹斑斑的文本特效。

SVG，过滤器，文本特效

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：