Beispiel:SVG-text-filter-11.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">  
  <style>
text {
  font-size: 100px; 
  font-family:arial;
  font-weight: bold;
  fill: black;
}
 
  </style>
  <title>Beispiel: SVG-Texteffekte-13</title>
</head>
 
<body>
  <h1>Hintergrundeffekte</h1>
 
<svg viewBox="0 0 880 200">
 
  <defs>
    <filter id="blob">
      <feGaussianBlur in="SourceAlpha" result="blurOut" stdDeviation="10"/>
      <feComponentTransfer in="blurOut" result="dropBlur">
        <feFuncA type="table" tableValues="0 .5 0 .5 0 .5 0 .5"/>
      </feComponentTransfer>
      <feComposite operator="over"
                   in="SourceGraphic" in2="dropBlur" />
     </filter>
  </defs>
 
  <text filter="url(#blob)" x="20" y="100" >
    Das ist der Blob!
  </text>
 
</svg> 
</body>
</html>