SVG: definzione e uso di pattern

    <svg fill="none" stroke-width="5">
    <defs>
        <pattern id="dots" x="0" y="0" width="10" height="10"
                 patternUnits="userSpaceOnUse">
            <circle cx="5" cy="5" r="4" fill="#800" />
        </pattern>
    </defs>   
    <polygon fill="url(#dots)" points="70,10 41,100 118,45 22,45 99,100" />
    <polyline stroke="url(#dots)" points="30,125 60,135 80,115 110,125" />
</svg>

Definisce elementi che non vengono visualizzati ma a cui gli altri elementi possono fare riferimento.

Definisce un modulo da usare come pattern di riempimento identificabile con il nome sole. Lo spigolo in alto a sinistra (x e y) ha come coordinate 0, 0 e le dimensioni (width e height) sono di 10 x 10 pixel. L’unità di misura degli elementi del pattern sarà quello dello spazio dell’elemento che utilizzerà il riempimento… in sostanza il pattern non verrà ingrandito o ridotto in base alle dimensioni dell’elemento.

Elemento (o elementi) che costituira il pattern con cui riempire le forme.

Imposta il riempimento o il contorno con il pattern definito con l’identificatore dots.

Aggiungere un terzo colore centrale (50%) alla definizione del gradiente.