Aggiungi la tua pagina
Digita l'indirizzo di un sito web, oppure passa a HTML e incolla il tuo codice o apri un file .html. La pagina di esempio mostra come funziona.
Inserisci l'indirizzo di un sito web o incolla il tuo HTML e visualizzalo in cornici grandi quanto veri schermi di smartphone, tablet, laptop e desktop, affiancate o una alla volta.
Trascina una cornice a qualsiasi larghezza, ruotala, passa tra i breakpoint più comuni, individua i contenuti che sbordano lateralmente e salva gli screenshot del tuo HTML.
Caricamento del tester…
Digita l'indirizzo di un sito web, oppure passa a HTML e incolla il tuo codice o apri un file .html. La pagina di esempio mostra come funziona.
Guarda un solo dispositivo e trascinane i bordi, oppure metti affiancati smartphone, tablet, laptop e desktop. Ruota quello che vuoi.
Leggi gli avvisi sui contenuti più larghi dello schermo, modifica il tuo HTML e guarda ogni cornice aggiornarsi, poi salva gli screenshot.
Gli smartphone più stretti in uso sono larghi da 320 a 360 pixel CSS. Se il layout regge lì, regge quasi ovunque.
I layout si rompono anche tra un dispositivo e l'altro. Trascina lentamente la cornice da stretta a larga e osserva il momento in cui qualcosa salta o si sovrappone.
Senza <meta name="viewport" content="width=device-width, initial-scale=1"> i telefoni impaginano la pagina a circa 980 pixel di larghezza e la rimpiccioliscono finché il testo diventa minuscolo.
Quando la pagina funziona a ogni dimensione, crea le immagini e le clip che le servono con WaveSpeed AI.
Crea immagini hero, illustrazioni e banner in qualsiasi proporzione.
Trasforma la foto di un prodotto in una breve clip per la landing page.
Trasforma la foto di un prodotto in un modello 3D per una pagina interattiva.
$1 in crediti gratuiti per i nuovi account idonei. Nessuna carta richiesta. I generatori hanno requisiti separati di account e crediti. Questo strumento è gratuito: Tester responsive.
Sì. Nessun account, nessun limite di dispositivi o pagine, nessuna filigrana sugli screenshot e niente da installare: funziona nel browser.
Inserisci l'indirizzo del tuo sito o incolla il tuo HTML, poi scegli tra oltre 40 dimensioni di smartphone, tablet, laptop e desktop, una alla volta o affiancate. Trascina una cornice a qualsiasi larghezza, ruotala o passa ai breakpoint più comuni.
Ogni cornice è una viewport del browser con la larghezza e l'altezza esatte di quello schermo in pixel CSS, quindi media query, layout e breakpoint rispondono proprio come su quel dispositivo.
Sì. Incolla il tuo HTML o apri un file .html per vederlo in anteprima a ogni dimensione e modificarlo dal vivo. I siti web si caricano via https; per un server di sviluppo locale usa un tunnel https o incolla l'HTML generato.
Sì. Nel tuo HTML segnala gli elementi più larghi dello schermo, la causa tipica dello scorrimento laterale sugli smartphone, e avvisa quando manca il meta tag viewport.
Sì, per l'HTML incollato: salva l'area visibile o la pagina intera come PNG al rapporto pixel del dispositivo, così una cornice larga 393 pixel a 3x produce un'immagine larga 1179 pixel.
Gli smartphone racchiudono da due a quattro pixel fisici in ogni pixel CSS. L'etichetta mostra questo rapporto e gli screenshot dell'HTML incollato vengono salvati con esso, così hanno la stessa nitidezza dello schermo reale.
No. Un sito web viene caricato dal tuo browser direttamente dal suo server, dentro le cornici, senza proxy in mezzo. L'HTML incollato e gli screenshot restano nel tuo browser; l'ultima pagina e le impostazioni vengono conservate nello spazio di archiviazione di questo browser.
Alcuni siti scelgono di non essere mostrati all'interno di altre pagine. Apri "Perché è vuoto?" per controllare le intestazioni del sito, oppure incolla l'HTML della pagina.
Incolla il tuo HTML o inserisci un indirizzo e confronta smartphone, tablet e desktop affiancati.