ChipsBuilder
Home Template Componenti News FAQ Accedi

Componenti interattivi
per il tuo sito

Grafici, mappe, animazioni, slider e molto altro. Basta chiederlo in chat e l'AI lo aggiunge al tuo sito.

68 componenti disponibili
Prova gratis
68 componenti pronti da aggiungere al tuo sito Prova gratis
📊 Grafici & Dati
Chart.js
Grafici interattivi: barre, torte, linee, radar e altro
💬 «Aggiungi un grafico a barre con le vendite mensili»
ApexCharts
Grafici avanzati per dashboard: area, heatmap, treemap
💬 «Crea una dashboard con grafico area delle vendite»
DataTables
Tabelle interattive con ricerca, ordinamento e paginazione
💬 «Aggiungi una tabella ordinabile con i prodotti»
D3.js
Visualizzazione dati avanzata con SVG interattivi
💬 «Crea un grafico SVG interattivo delle vendite»
Chart.xkcd
Grafici in stile XKCD disegnati a mano
💬 «Crea grafici simpatici in stile fumetto»
🗺 Mappe
Leaflet
Mappe interattive gratuite con marker e popup
💬 «Aggiungi una mappa con la posizione del negozio»
Mapbox GL JS
Mappe stilizzate con temi personalizzati e 3D
💬 «Inserisci una mappa Mapbox con stile dark»
✨ Animazioni & Scroll
GSAP
Animazioni professionali con timeline e scroll trigger
💬 «Anima le sezioni quando appaiono allo scroll»
AOS
Animazioni allo scroll semplici e immediate
💬 «Aggiungi animazioni fade-in alle sezioni allo scroll»
Animate.css
Animazioni CSS pronte: fade, bounce, slide, zoom
💬 «Aggiungi un effetto fadeIn al titolo»
Lottie
Animazioni vettoriali da After Effects / LottieFiles
💬 «Inserisci un'animazione Lottie nella hero»
Barba.js
Transizioni fluide e animate tra le pagine
💬 «Aggiungi transizioni fade tra le pagine del sito»
Vivus
Animazione SVG che si disegna linea per linea
💬 «Aggiungi un logo SVG che si disegna animato»
Anime.js
Animazioni JS fluide con timeline, stagger ed easing
💬 «Anima le card dei servizi con effetto elastico»
ScrollReveal
Animazioni di comparsa allo scroll
💬 «Fai apparire le sezioni con effetto slide-up»
Lenis
Smooth scroll premium fluido e morbido
💬 «Aggiungi scroll fluido a tutto il sito»
📝 Testo & Tipografia
Typed.js
Effetto macchina da scrivere con parole che cambiano
💬 «Aggiungi un effetto typewriter nel titolo»
CountUp.js
Numeri che contano animati per statistiche
💬 «Aggiungi contatori animati per i numeri aziendali»
Splitting.js
Divide testo in caratteri/parole per animazioni creative
💬 «Aggiungi un titolo con animazione lettera per lettera»
Fitty
Adatta automaticamente la dimensione del testo al contenitore
💬 «Fai adattare il titolo alla larghezza del container»
Mark.js
Evidenziazione e ricerca testo nella pagina
💬 «Aggiungi ricerca con evidenziazione nel testo»
🖼 Slider & Gallerie
Splide.js
Slider e caroselli leggeri e responsive
💬 «Crea uno slider con le immagini dei progetti»
Swiper
Slider premium con touch, effetti 3D e parallax
💬 «Crea uno slider full-screen con effetto coverflow»
PhotoSwipe
Galleria lightbox con zoom e swipe
💬 «Aggiungi una galleria foto con lightbox»
Masonry
Griglia stile Pinterest con altezze diverse
💬 «Crea una griglia masonry per il portfolio»
GLightbox
Lightbox moderno per immagini e video YouTube
💬 «Aggiungi una galleria con lightbox fullscreen»
Isotope
Griglia portfolio filtrabile con animazioni
💬 «Crea un portfolio filtrabile per categoria»
Embla Carousel
Carosello ultra-leggero con touch e loop
💬 «Crea un carosello testimonial con Embla»
🧊 Effetti 3D & Hover
Three.js
Oggetti e scene 3D interattive nel browser
💬 «Aggiungi un oggetto 3D rotante nella hero»
vanilla-tilt.js
Effetto tilt 3D al passaggio del mouse sulle card
💬 «Aggiungi un effetto tilt 3D sulle card dei servizi»
Atropos
Effetto parallax 3D premium con livelli sovrapposti
💬 «Aggiungi un effetto parallax 3D sulle card»
canvas-confetti
Effetto coriandoli per celebrazioni e successo
💬 «Aggiungi confetti quando si invia il form»
Zdog
Illustrazioni pseudo-3D animate e colorate
💬 «Aggiungi un oggetto 3D illustrativo nella hero»
🌀 Sfondo & Parallax
tsParticles
Sfondo animato con particelle flottanti
💬 «Aggiungi particelle animate nello sfondo della hero»
Rellax.js
Effetto parallax leggero per sezioni e sfondi
💬 «Aggiungi un effetto parallax alle immagini»
Simple Parallax
Parallax semplice sulle singole immagini
💬 «Applica un effetto parallax alle foto»
Granim.js
Sfondi gradient animati e interattivi
💬 «Aggiungi uno sfondo con gradiente animato nella hero»
📦 Form & Input
Flatpickr
Date picker elegante per form di prenotazione
💬 «Aggiungi un selettore data al form di contatto»
Choices.js
Select avanzati con ricerca, tag e selezione multipla
💬 «Trasforma il select in un dropdown con ricerca»
noUiSlider
Slider range per prezzi, filtri e configuratori
💬 «Aggiungi uno slider per filtrare per range di prezzo»
Tagify
Campo input con tag, suggerimenti e autocompletamento
💬 «Aggiungi un campo tag per le competenze nel form»
Signature Pad
Area per firma digitale con touch e mouse
💬 «Aggiungi un campo firma digitale nel form»
Cleave.js
Formattazione automatica input (carte, telefoni, date)
💬 «Formatta automaticamente carta e telefono nel form»
🎯 UI & Interazioni
Alpine.js
Accordion, tab, modal e toggle interattivi
💬 «Aggiungi un accordion per le FAQ»
SweetAlert2
Popup e modali eleganti con conferme e form
💬 «Mostra un popup di conferma all'invio del form»
Tippy.js
Tooltip e popover eleganti al passaggio del mouse
💬 «Aggiungi tooltip alle icone dei servizi»
Notyf
Notifiche toast non bloccanti per feedback utente
💬 «Mostra una notifica di successo dopo l'invio»
SortableJS
Liste ordinabili con drag and drop
💬 «Rendi la lista riordinabile col trascinamento»
Driver.js
Tour guidati e onboarding interattivo step-by-step
💬 «Aggiungi un tour guidato delle funzionalita del sito»
Progressbar.js
Barre e cerchi di progresso animati
💬 «Aggiungi indicatori circolari per le competenze»
Micromodal
Modali accessibili leggeri (1.9KB)
💬 «Aggiungi modali per i dettagli dei servizi»
🎬 Media & Codice
Plyr
Player video/audio personalizzabile per YouTube e file
💬 «Aggiungi un video player personalizzato»
FullCalendar
Calendario eventi interattivo con viste mese/settimana
💬 «Aggiungi un calendario con gli eventi del mese»
Prism.js
Syntax highlighting colorato per blocchi di codice
💬 «Aggiungi syntax highlighting ai blocchi di codice»
Vanilla Lazyload
Caricamento differito di immagini e video
💬 «Ottimizza il caricamento delle immagini con lazy load»
Wavesurfer.js
Player audio con visualizzazione waveform
💬 «Aggiungi un player audio con forma d'onda»
Mermaid.js
Diagrammi e flowchart da testo semplice
💬 «Aggiungi un diagramma di flusso del processo»
Reveal.js
Presentazioni HTML interattive con slide
💬 «Crea una presentazione slide dei servizi»
🖼️ Immagini & Canvas
Panzoom
Zoom e pan interattivo su immagini e prodotti
💬 «Aggiungi zoom interattivo sulle immagini prodotto»
Cropper.js
Ritaglio immagini interattivo per foto profilo e avatar
💬 «Aggiungi un editor di ritaglio per la foto profilo»
Rough Notation
Annotazioni disegnate a mano: sottolineature, cerchi
💬 «Aggiungi sottolineature animate sui titoli»
Fabric.js
Editor canvas interattivo con drag, resize e disegno
💬 «Crea un canvas dove trascinare e modificare forme»
Rough.js
Grafiche e illustrazioni in stile hand-drawn
💬 «Aggiungi illustrazioni disegnate a mano»
🎨 Creative & Generativo
p5.js
Creative coding e arte generativa nel browser
💬 «Aggiungi uno sfondo generativo con particelle»
🔧 Utilità
QRious
Generatore di QR code dinamici per link e contatti
💬 «Aggiungi un QR code che punta al sito»
Lucide Icons
Libreria 1400+ icone moderne, leggere e personalizzabili
💬 «Usa Lucide Icons per le icone dei servizi»
Matter.js
Motore fisico 2D: gravita, rimbalzi, collisioni interattive
💬 «Aggiungi elementi che cadono e rimbalzano nella hero»
html2canvas
Cattura screenshot di elementi HTML come PNG
💬 «Aggiungi pulsante salva come immagine»

Prova questi componenti sul tuo sito

Registrati gratis, crea il sito e chiedi all'AI di aggiungere quello che vuoi

Prova gratis