WAVESPEED AI PENGUJI RESPONSIF Kode Anda tetap di perangkat Anda

100% GRATIS

Penguji Desain Responsif GratisLihat halaman Anda di setiap ukuran layar sekaligus.

Masukkan alamat website atau tempel HTML Anda dan lihat hasilnya dalam bingkai seukuran layar HP, tablet, laptop, dan desktop sungguhan, berdampingan atau satu per satu.
Seret bingkai ke lebar berapa pun, putar, lompat antar-breakpoint umum, temukan konten yang meluber ke samping, dan simpan tangkapan layar HTML Anda.

40+ ukuran layarTampilan berdampinganPendeteksi overflow

Tanpa daftar Tanpa proxy Tanpa tanda air

Memuat penguji…

HTML yang ditempel tetap di browser Anda. Website dimuat langsung dari servernya sendiri.

TIGA LANGKAH MUDAH

Cara menguji desain responsif

Tambahkan halaman Anda

Ketik alamat website, atau beralih ke HTML lalu tempel kode Anda atau buka file .html. Halaman contoh menunjukkan cara kerjanya.

Pilih layarnya

Lihat satu perangkat dan seret tepinya, atau letakkan HP, tablet, laptop, dan desktop berdampingan. Putar yang mana pun.

Perbaiki dan ambil gambar

Baca peringatan untuk konten yang lebih lebar dari layar, edit HTML Anda dan lihat setiap bingkai diperbarui, lalu simpan tangkapan layar.

Tips agar tata letak tetap rapi di setiap ukuran

Mulai dari 320 piksel

HP tersempit yang masih dipakai memiliki lebar 320 hingga 360 piksel CSS. Jika tata letak rapi di sana, hampir pasti rapi di mana-mana.

Seret, jangan hanya memilih perangkat

Breakpoint juga bisa rusak di antara ukuran perangkat. Seret bingkai perlahan dari sempit ke lebar dan perhatikan saat ada yang melompat atau bertumpuk.

Jangan lupakan tag viewport

Tanpa <meta name="viewport" content="width=device-width, initial-scale=1"> HP menata halaman selebar sekitar 980 piksel lalu mengecilkannya hingga teks menjadi sangat kecil.

WaveSpeed AI

Dari tata letak ke visual

Setelah halaman berfungsi di setiap ukuran, buat gambar dan klip yang dibutuhkannya dengan WaveSpeed AI.

Mulai berkarya Jelajahi 1.000+ Model AI

1.000+ model AI
Gambar, video, dan 3D
Bayar sesuai pemakaian

Kredit gratis $1 untuk akun baru yang memenuhi syarat. Tanpa kartu. Generator memerlukan akun dan kredit tersendiri. Penguji responsif ini gratis.

FAQ penguji responsif

Apakah penguji desain responsif ini gratis?

Ya. Tanpa akun, tanpa batasan perangkat atau halaman, tanpa tanda air pada tangkapan layar, dan tanpa instalasi: semuanya berjalan di browser Anda.

Bagaimana cara menguji website saya di berbagai ukuran layar?

Masukkan alamat situs Anda atau tempel HTML, lalu pilih dari lebih dari 40 ukuran HP, tablet, laptop, dan desktop, satu per satu atau berdampingan. Seret bingkai ke lebar berapa pun, putar, atau lompat ke breakpoint umum.

Seberapa akurat ukuran perangkatnya?

Setiap bingkai adalah viewport browser dengan lebar dan tinggi persis layar tersebut dalam piksel CSS, sehingga media query, tata letak, dan breakpoint Anda bereaksi sama seperti di perangkat itu.

Bisakah saya menguji HTML sendiri atau situs lokal?

Bisa. Tempel HTML Anda atau buka file .html untuk melihat pratinjau di setiap ukuran dan mengeditnya secara langsung. Website dimuat lewat https; untuk server pengembangan lokal, gunakan tunnel https atau tempel HTML hasil build.

Apakah alat ini menemukan masalah tata letak?

Ya. Di HTML Anda, alat ini menandai elemen yang lebih lebar dari layar, penyebab umum gulir ke samping di HP, dan memperingatkan jika meta tag viewport tidak ada.

Bisakah saya menyimpan tangkapan layar?

Bisa, untuk HTML yang ditempel: simpan area terlihat atau satu halaman penuh sebagai PNG pada rasio piksel perangkat, sehingga bingkai selebar 393 piksel pada 3x menghasilkan gambar selebar 1179 piksel.

Apa arti label rasio piksel?

HP memadatkan dua hingga empat piksel fisik ke dalam setiap piksel CSS. Label menunjukkan rasio tersebut, dan tangkapan layar HTML yang ditempel disimpan pada rasio itu, sehingga ketajamannya sama dengan layar sungguhan.

Apakah halaman saya melewati server Anda?

Tidak. Website dimuat langsung dari servernya sendiri oleh browser Anda, di dalam bingkai, tanpa proxy di antaranya. HTML yang ditempel dan tangkapan layar tetap di browser Anda; halaman dan pengaturan terakhir Anda disimpan di penyimpanan browser ini.

Mengapa sebuah website tetap kosong?

Beberapa situs memilih untuk tidak ditampilkan di dalam halaman lain. Buka "Mengapa kosong?" untuk memeriksa header situs, atau tempel HTML halamannya sebagai gantinya.

Semua alat gratis