CodePen Challenge # 5 Spooky Halloween SVG Personaggi

Tempo per un'altra sfida CodePen! Con Halloween proprio dietro l'angolo, vorremmo che tu diventassi creativo con qualche SVG spettrale. Hai tre personaggi tra cui scegliere: i migliori esempi saranno esposti alla fine di ottobre!

Aggiornamento: risultati!

Beh, immagino che non si possa mai dire: questa Sfida CodePen non ha tirato quasi tutte le voci che avevo pensato (9, rispetto alla 153 della precedente sfida!) Ma come ringraziamento a tutti quelli che hanno preso parte, qui ci sono tutte e nove le voci!

La sfida

Vogliamo che mostri le tue abilità SVG. Puoi usare CSS, anche JavaScript, ma lo sei non autorizzato toccare il markup SVG stesso! Gli SVG sono stati deliberatamente mantenuti relativamente semplici. Ognuno è costruito da pochi percorsi, tratti e forme. Gli elementi all'interno di SVG hanno tutti un ID univoco, che vedrai anche nel CSS, insieme ad alcuni stili. Puoi modificare i colori, aggiungere animazioni, effetti, qualunque cosa tu voglia!

A voi

Ecco cosa devi fare, in pochi semplici passaggi.

Passo 1

In primo luogo, scegli una delle tre demo su CodePen:

Passo 2

Colpire il Forchetta per creare la tua copia personale, quindi apportare tutte le modifiche che vuoi al CSS e al JavaScript.

Passaggio 3 (facoltativo)

Se hai effettuato l'accesso a CodePen, puoi modificare la descrizione premendo il pulsante impostazioni pulsante. Usa questo per dare un'idea alla gente di quello che hai fatto.

Passaggio 4

Colpire Salvare, hai finito. Assicurati di farci sapere nei commenti quando hai finito, e sentiti libero di farcelo sapere twittando anche noi @wdtuts.

Questo è tutto! Tutte le voci verranno aggiunte a questa raccolta su CodePen e i migliori esempi verranno mostrati su Tuts + il 31 ottobre!

Buona fortuna e non dimenticare di seguire Tuts + su Codepen!