Generator Gambar OG
Ketik judul dan subjudul, pilih latar belakang solid atau gradien dan URL logo opsional, pratinjau kartu sosial 1200x630 secara langsung, lalu unduh sebagai PNG.
Generator Gambar OG — Buat gambar Open Graph 1200x630 yang muncul saat halaman Anda dibagikan di Facebook, X/Twitter, LinkedIn, atau Slack. Masukkan judul dan subjudul, pilih latar belakang solid atau gradien dua warna, atur warna dan perataan teks, dan secara opsional arahkan ke URL logo. Pratinjau langsung digambar ulang saat Anda mengetik dan Anda dapat mengunduh kartu yang sudah jadi sebagai PNG. Gambar sepenuhnya digambar pada canvas di browser Anda, sehingga teks dan warna Anda tidak pernah meninggalkan perangkat Anda.
Apa itu Generator Gambar OG?
Generator Gambar OG adalah alat gratis di dalam browser untuk membuat kartu berbagi sosial (gambar Open Graph / Twitter Card) pada ukuran standar 1200x630 piksel. Marketer, blogger, pengembang indie, dan siapa pun yang merilis landing page menggunakannya untuk membuat thumbnail pratinjau yang rapi tanpa membuka aplikasi desain. Anda mengetik judul utama dan subjudul opsional, memilih warna solid atau gradien diagonal, mengatur warna teks serta perataan kiri atau tengah, dan menempelkan URL logo jika ingin tanda merek di sudut. Canvas digambar ulang secara langsung sehingga Anda dapat menyempurnakan kata-kata dan warna, lalu mengekspor PNG yang siap dirujuk di tag meta og:image Anda.
Cara menggunakan Generator Gambar OG
- Ketik judul Anda di kolom Judul; judul digambar besar dan tebal serta dibungkus hingga tiga baris.
- Tambahkan subjudul opsional di bawah judul, atau biarkan kosong untuk menampilkan hanya judul utama.
- Buka Pengaturan untuk memilih latar belakang solid atau gradien, atur warna latar dan teks, lalu pilih perataan kiri atau tengah.
- Secara opsional tempelkan URL gambar logo (gambar dengan CORS aktif) untuk menempatkan logo di atas teks.
- Perhatikan pratinjau 1200x630 diperbarui secara langsung, klik untuk memperbesar, lalu unduh kartu sebagai PNG.
Contoh
Kartu berbagi postingan blog
Ketik judul artikel sebagai judul dan nama penulis atau situs sebagai subjudul, pilih gradien yang sesuai dengan merek Anda, dan unduh PNG 1200x630 untuk digunakan sebagai og:image postingan.
Banner peluncuran produk
Gunakan warna merek solid, perataan tengah, tagline Anda sebagai judul, dan URL logo di sudut untuk menghasilkan kartu peluncuran yang konsisten di setiap kanal sosial.
Pertanyaan yang sering diajukan
- Berapa ukuran gambar yang dihasilkan?
- Selalu 1200x630 piksel, rasio aspek standar Open Graph dan Twitter summary-large-image (sekitar 1,91:1). Ukuran itu tampil tajam pada pratinjau tautan di Facebook, X/Twitter, LinkedIn, Slack, dan Discord.
- Bagaimana cara menambahkan logo saya sendiri?
- Tempelkan URL langsung ke gambar logo di kolom URL Logo. Gambar diambil dari URL tersebut dan digambar di atas teks pada tinggi tetap dengan rasio aspeknya dipertahankan. Sumber harus mengizinkan penggunaan lintas-asal (CORS) atau browser akan memblokir penggambarannya pada canvas.
- Bisakah saya mengontrol warna dan tata letak?
- Ya. Di Pengaturan Anda dapat beralih antara latar belakang solid dan gradien diagonal dua warna, mengatur warna latar dan warna teks, serta memilih perataan kiri atau tengah. Judul dan subjudul dibungkus secara otomatis dan teks panjang dipotong dengan elipsis.
- Apakah teks atau gambar saya diunggah ke suatu tempat?
- Tidak. Kartu sepenuhnya digambar pada canvas HTML di browser Anda dan diekspor ke PNG secara lokal. Judul, subjudul, dan warna Anda tidak pernah dikirim ke server. Hanya URL logo yang Anda berikan yang diambil, dan permintaan itu langsung dari browser Anda ke host yang Anda pilih.
Alat terkait
Kode ke Gambar
Ubah cuplikan kode menjadi gambar dengan penyorotan sintaksis di browser Anda, dengan 20+ bahasa, tema dan latar kustom, nomor baris, serta ekspor PNG atau SVG.
Pemeriksa Kontras Warna
Periksa kontras WCAG 2.1 dan skor APCA Lc antara warna teks dan latar belakang, lihat lencana AA, AAA, dan 3:1, lalu terapkan warna lolos terdekat.
Pencampur Warna
Campurkan dua warna HEX pada rasio yang dipilih dalam ruang warna RGB atau Lab dan baca warna tengah hasilnya sebagai sampel dan nilai HEX yang dapat disalin.
Generator Gradasi Warna
Ubah satu warna HEX dasar menjadi skala OKLCH, HSL, atau RGB dengan langkah yang bisa diatur, petunjuk kontras WCAG per langkah, dan ekspor ke CSS, Tailwind, dan JSON.