| <!DOCTYPE html> |
| <svg width="400" height="100" color-interpolation-filters="sRGB"> |
| <!-- type=fractalNoise --> |
| <filter id="fn1" x="0" y="0" width="1" height="1"> |
| <feTurbulence type="fractalNoise" baseFrequency="-1 1"/> |
| <feComponentTransfer> |
| <feFuncR type="discrete" tableValues="1 0 1"/> |
| <feFuncG type="discrete" tableValues="0 0.502 0"/> <!-- map [0..1/3] -> 0; [1/3...2/3] -> 0.502; [2/3..1] -> 0 --> |
| <feFuncB type="discrete" tableValues="0"/> |
| <feFuncA type="discrete" tableValues="0 1 0"/> |
| </feComponentTransfer> |
| </filter> |
| <rect width="100" height="100" filter="url(#fn1)"/> |
| |
| <filter id="fn2" x="0" y="0" width="1" height="1"> |
| <feTurbulence type="fractalNoise" baseFrequency="1 -1"/> |
| <feComponentTransfer> |
| <feFuncR type="discrete" tableValues="1 0 1"/> |
| <feFuncG type="discrete" tableValues="0 0.502 0"/> <!-- map [0..1/3] -> 0; [1/3...2/3] -> 0.502; [2/3..1] -> 0 --> |
| <feFuncB type="discrete" tableValues="0"/> |
| <feFuncA type="discrete" tableValues="0 1 0"/> |
| </feComponentTransfer> |
| </filter> |
| <rect width="100" height="100" filter="url(#fn2)" x="100"/> |
| |
| <!-- type=turbulence --> |
| <filter id="tb1" x="0" y="0" width="1" height="1"> |
| <feTurbulence type="turbulence" baseFrequency="-1 1"/> |
| <feColorMatrix values="1 0 0 0 0, 0 1 0 0 0.502, 0 0 1 0 0, 0 0 0 1 1"/> |
| </filter> |
| <rect width="100" height="100" filter="url(#tb1)" x="200"/> |
| |
| <filter id="tb2" x="0" y="0" width="1" height="1"> |
| <feTurbulence type="turbulence" baseFrequency="1 -1"/> |
| <feColorMatrix values="1 0 0 0 0, 0 1 0 0 0.502, 0 0 1 0 0, 0 0 0 1 1"/> |
| </filter> |
| <rect width="100" height="100" filter="url(#tb2)" x="300"/> |
| </svg> |
