<img src="placeholder.png" width="800" height="400" alt="Placeholder">Use width and height attributes to prevent layout shift (CLS)
background: #ccc url('placeholder.svg') center/cover;SVG placeholders are ideal for CSS backgrounds — infinitely scalable
<Image src="/placeholder.png" width={800} height={400} alt="..." />Use Next.js Image component for automatic optimization
<img src="data:image/png;base64,..." alt="Placeholder">Embed small placeholders directly in HTML — no extra HTTP request
| Kasus Penggunaan | Dimensi | Rasio Aspek |
|---|---|---|
| Favicon / Icon | 64 × 64 | 1:1 |
| Avatar / Profile | 150 × 150 | 1:1 |
| Thumbnail | 300 × 200 | 3:2 |
| Blog Feature Image | 1200 × 630 | ~1.9:1 |
| Social Media OG | 1200 × 630 | ~1.9:1 |
| Hero Banner | 1920 × 600 | 16:5 |
| Full HD | 1920 × 1080 | 16:9 |
| Product Photo | 800 × 800 | 1:1 |
Gambar placeholder digunakan dalam pengembangan web dan desain untuk mengisi ruang gambar selama prototipang, wireframing, dan pengembangan sebelum gambar akhir siap. Mereka membantu memvisualisasikan tata letak dan menguji desain responsif.
Ya, semua gambar placeholder yang dihasilkan oleh alat ini dibuat secara lokal di browser Anda dan gratis digunakan untuk tujuan apa pun, termasuk proyek komersial.
PNG adalah format gambar raster berbasis piksel yang didukung oleh semua browser dan aplikasi. SVG adalah format berbasis vektor yang dapat diputar tanpa kehilangan kualitas — ideal untuk layar beresolusi tinggi. Gunakan SVG untuk mockup desain web dan PNG untuk kompatibilitas universal.
Ya! Anda dapat memasukkan lebar dan tinggi apa pun dalam piksel. Alat ini mendukung dimensi apa pun dari 1×1 hingga nilai yang sangat besar. Untuk ukuran web standar, gunakan prasetel seperti Avatar, Gambar Mini, Banner, Social OG, dan template HD.