Saya cuba mencipta kesan "malam berbintang" yang telus menggunakan SVG. Saya meletakkan SVG sebaris dalam elemen latar belakang hitam pada halaman web. Saya bermula dengan penapis turbulensi dan kemudian menggunakan matriks warna untuk mendapatkan kesan yang diingini:

<svg xmlns="http://www.w3.org/2000/svg">
    <filter id="filter">
        <feTurbulence baseFrequency="0.2" />
        <feColorMatrix values="
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 0 1" />
    </filter>
    <rect width="100%" height="100%" filter="url(#filter)" />
</svg>

...diberikan:

Tetapi ini tidak mempunyai ketelusan alfa; Saya mahu ia mewakili satah piksel putih yang kecerahannya hanya dikurangkan dengan berada pada latar belakang hitam dan mempunyai kurang kelegapan. Jadi saya meletakkannya melalui penapis kedua untuk melakukan ini:

<svg xmlns="http://www.w3.org/2000/svg">
    <filter id="filter">
        <feTurbulence baseFrequency="0.2" />
        <feColorMatrix values="
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 0 1" />
        <feColorMatrix values="
            0 0 0 0 1
            0 0 0 0 1
            0 0 0 0 1
            1 1 1 0 0" />
    </filter>
    <rect width="100%" height="100%" filter="url(#filter)" />
</svg>

...diberikan:

Ini sangat serupa tetapi lebih gelap sedikit. Mengapa ia lebih gelap sedikit? Apabila ditindih pada latar belakang hitam, bukankah ia sepatutnya menghasilkan warna piksel yang sama?