Top code pens 2022

Bordo animato con gradiente

Vedi il Pen Bordo animato con gradiente by Shaw (@shshaw) on CodePen.

Preloader palla di neve

Vedi il Pen Palla di nevePreloader by Jon Kantner (@jkantner) on CodePen.

Effetto Hover su pulsanti glassmorfici – Glass Morphism

Vedi il Pen Effetto Hover su pulsanti glassmorfici | Glass Morphism by Katarzyna Marta Kuich (@katarzynamarta) on CodePen.

Hover effect magico

Vedi il Pen Pen Hover effect magico (w/ Tutorial) by Hyperplexed (@Hyperplexed) on CodePen.

Dispiacere a piede di pagina

Vedi il Pen Dispiacere a piede di pagina by Steve Gardner (@ste-vg) on CodePen.

Cursore Neon

Vedi il Pen Pen ThreeJS Toys – Cursore Neon by Kevin Levron (@soju22) on CodePen.

Pokemon Cards

Visualizza il Pen Pokemon Cards Holo effect v2 by Simon Goellner (@simeydotme) on CodePen.

Albero di natale HTML CSS e Javascript

Vedi il Pen Albero di natale HTML CSS e Javascript: Animated Lights by Dan Wilson (@danwilson) on CodePen.

Babbo natale in 3d pixel grid – HTML e CSS

Vedi il Pen Babbo natale in 3d pixel grid – HTML e CSS by Mark Boots (@MarkBoots) on CodePen.

Albero di natale con luci animate – CSS e HTML

See the Pen [CPC] CSS Swinging Christmas Tree by Zed Dash (@z-) on CodePen.

Una bellissima galleria fotografica

Vedi il Pen Una bellissima galleria fotografica by Toshiya Marukubo (@toshiya-marukubo) on CodePen.

Scrivere con i fiori

Vedi il Pen Flower Typer Three.js – Demo #3 by Ksenia Kondrashova (@ksenia-k) on CodePen.

Glow button di Aaron Iker

Vedi il Pen Pen Glow Button by Aaron Iker (@aaroniker) on CodePen.

Effetto testo tagliato con i CSS


Shireen Taj crea un effetto tipo”testo tagliato” con i CSS, l’ombra sfumata tra i bordi tagliati migliora notevolmente l’effetto simile.

Visualizza il Pen Effetto testo tagliato con i CSS by Shireen Taj (@TajShireen) on CodePen.

CSSimon V2


Alvaro Montoro rivisita il suo CSSimon originale del 2018 in questo v2 completamente aggiornato. ‘Attiva/disattiva l’interruttore e segui la sequenza dei colori. Buona fortuna! E divertiti!’

Vedi il pen CSSimon (v2) by Alvaro Montoro (@alvaromontoro) on CodePen.

Un modo creativo di usare odd e even

Visualizza il Pen Codepen Team Member List – Even/Odd Styles by Josetxu (@josetxu) on CodePen.

Caricatore Ice Pop

Visualizza il Pen Caricatore Ice Pop by Dario Corsi (@dariocorsi) on CodePen.

Multi zoom su immagine – CSS puro

Visualizza il Pen Multi zoom su immagine – CSS puro ? [general sibling combinators, bg image] by Adrian Roselli (@aardrian) on CodePen.

La foresta – landing page- effetto parallasse

Visualizza il Pen La foresta – landing page- effetto parallasse by Robert Gil Baptista (@robertgbaptista) on CodePen.

3d Even e Odd

https://codepen.io/challenges/2022/june/Even and Odd

Visualizza il pen CodePenChallenge: Even and Odd by Sergey (@Semali) on CodePen.

Glassmorphism Icon

https://codepen.io/challenges/2022/april/icons

Visualizza il pen Glassmorphism Icon Buttons by Taylon, Chan (@tin-fung-hk) on CodePen.

Formattazione elenchi cose da fare

https://codepen.io/challenges/2022/april/1

Visualizza il pen Checkboxes scritte a mano – Little Details April 2022 Challenge by Theo Gainey (@theogainey) on CodePen.

Visualizza il pen Tavola interattiva con sticky notes by André Seiji (@andreseiji) on CodePen.

See the Pen To-do list by Alex Hart (@ahart814) on CodePen.

Sfida Codepen: testate enormi – mega menu

Vedi il pen Sfida Codepen: testate enormi/Mega Menus by Sicontis (@Sicontis) on CodePen.

Mega pulsante

Vedi il pen Mega pulsante by Josetxu (@josetxu) on CodePen.

Gradiente generativo: SVG generati e animati in modo casuale.

Vedi il Pen Gradiente generativo: SVG generati e animati in modo casuale, di Yoav Kadosh (@ykadosh) on CodePen.

Esperimento con le maschere SVG

Vedi il Pen Esperimento con le maschere SVG by leimapapa (@leimapapa) on CodePen.