Softonic

Konverter HTML ke gambar

Langkah 1 / 3

Tempel cuplikan HTML. Skrip, formulir, bingkai, dan pengendali peristiwa dihapus sebelum dirender.

Ubah cuplikan HTML dan CSS menjadi PNG atau JPG berukuran tetap tanpa mengunggah kode sumber maupun gambar ke server kami. Pilih 64 sampai 1.920 px per sisi serta skala 1x sampai 3x, lalu lihat pratinjau dan unduh hasilnya di browser.

Cara merender HTML sebagai gambar

  1. 1

    Tempel kode

    Masukkan cuplikan atau dokumen HTML. CSS sebaris dan aturan `<style>` didukung; skrip, formulir, bingkai, dan pengendali peristiwa dihapus.

  2. 2

    Atur kanvas

    Pilih PNG atau JPG, masukkan lebar dan tinggi, lalu tentukan skala dari 1x sampai 3x.

  3. 3

    Render pratinjau

    Browser menyusun kode yang telah dibersihkan di dalam bingkai terisolasi dengan ukuran tetap.

  4. 4

    Unduh secara lokal

    Simpan PNG atau JPG secara langsung. Berkas yang dibuat tidak diunggah ke server kami.

Yang didukung perender browser

Konverter memakai mesin tata letak browser. HTML biasa, CSS sebaris, aturan <style>, Flexbox, Grid, gradien, bayangan, SVG tersemat, dan font yang terpasang dapat muncul dalam hasil. Keluaran berupa gambar raster diam, bukan salinan halaman yang interaktif.

Aturan kanvas dan keluaran

Pengaturan Rentang yang didukung Perilaku
Lebar 64 sampai 1.920 px Lebar CSS tepat dari bingkai
Tinggi 64 sampai 1.920 px Tinggi CSS tepat; isi berlebih dipotong
Skala 1x sampai 3x Menambah resolusi tanpa mengubah tata letak
PNG Raster berukuran tetap Mempertahankan area transparan
JPG Raster berukuran tetap Memakai kualitas 92% dan latar putih

Keluaran dibatasi hingga 16 megapiksel untuk melindungi memori browser. Jika dimensi dan skala melampaui batas itu, alat menurunkan skala ke langkah 0,5x tertinggi yang aman. Sumber HTML dibatasi hingga 100.000 karakter.

Privasi dan sumber daya jarak jauh

HTML dan gambar data yang dibuat tetap berada di browser saat ini. Dalam mode bertahap, penyimpanan sesi tab ini menahan pengaturan sampai langkah berikutnya, sedangkan mulai ulang akan menghapusnya. Alat tidak mengirim kode atau gambar ke server kami.

URL eksternal merupakan pengecualian. Gambar, font web, dan stylesheet jarak jauh diminta dari server sumber, yang dapat melihat permintaan tersebut. CORS atau kontrol akses juga dapat menggagalkan pemuatan. Sematkan gambar dan font sebagai URL data serta gunakan CSS sebaris jika proses harus sepenuhnya luring.

Batas keamanan dan kesesuaian

Skrip, formulir, bingkai bertingkat, objek tersemat, dan atribut peristiwa dihapus sebelum pengambilan. Pratinjau menjadi noninteraktif, tetapi proses ini bukan pengganti pembersih HTML untuk konten yang akan diterbitkan di tempat lain. Widget JavaScript tidak berjalan, keadaan video dan canvas tidak dijamin, animasi menjadi satu bingkai, dan CSS khusus browser dapat berbeda pada mesin lain.

Pertanyaan yang Sering Diajukan

Ya. Perender mengambil aturan <style> dan tautan stylesheet yang didukung dari head, lalu menangkap isi body. Skrip, metadata, formulir, bingkai, dan pengendali aktif dihapus, sehingga hasilnya bukan halaman yang dapat dinavigasi.

Server sumber mungkin memblokir penggunaan lintas domain, meminta autentikasi, atau merespons terlalu lambat. Pakai URL yang dapat diakses dan mengizinkan CORS, atau sematkan sumber daya sebagai URL data.

PNG mempertahankan piksel transparan. JPG memakai latar putih dan kualitas tetap 92%, yang biasanya lebih kecil untuk foto. Alat ini tidak mengekspor WebP dan tidak menyediakan kontrol kualitas terpisah.

Konverter membatasi keluaran hingga 16 megapiksel. Untuk kanvas besar, alat otomatis memilih langkah 0,5x tertinggi yang aman agar memori browser tidak habis.

Alat Terkait

Generator Konfigurasi Webpack

Buat webpack.config.js untuk webpack 5 bagi JavaScript biasa, React, atau Vue: TypeScript, Babel, CSS atau Sass, gambar, HtmlWebpackPlugin, server pengembangan, dan baris npm install.

Referensi Tabel ASCII

Tabel ASCII lengkap dari 0 sampai 127 dengan desimal, heksadesimal, oktal, biner, dan referensi karakter numerik HTML untuk setiap karakter, termasuk kode kontrol seperti NUL, LF, dan DEL.

Validator OpenAPI

Tempel dokumen OpenAPI atau Swagger dalam JSON atau YAML dan periksa struktur intinya: bidang versi, objek info, dan paths, dengan galat dan peringatan yang jelas.

Generator Loader CSS

Buat spinner lingkaran CSS murni: atur diameter, ketebalan border, warna dan kecepatan rotasi, lihat pratinjau langsung, lalu salin CSS siap pakai. Tanpa SVG, tanpa JavaScript.

Pemformat PHP

Tambahkan baris baru dan indentasi 2 atau 4 spasi ke cuplikan PHP sederhana. Periksa hasilnya: alat ini bukan parser PHP dan tidak menerapkan PSR-12.

Referensi Karakter HTML

Daftar entitas HTML yang dapat dicari, beserta kode bernama dan kode numeriknya, serta fitur salin dengan satu klik untuk karakter khusus dan simbol.

Alat ini tersedia dalam bahasa lain