Lompat ke alat
JoeLucky

Klik ★ pada alat untuk menyimpannya

Kategori Alat

Kode ke GambarPembuat Gradien CSSGlassmorphism CSSPembuat Box ShadowPembuat Loader CSSPembuat Blob SVGSVG ke PNGPemeriksa Kontras WarnaPengubah PX / REM / EM
JoeLucky

Alat online praktis, semua di satu tempat

Kebijakan PrivasiKetentuan Layanan

© 2026 JoeLucky®. Hak cipta dilindungi.

  1. JoeLucky
  2. /CSS & Desain
  3. /Kode ke Gambar

Kode ke Gambar

Ubah potongan kode menjadi tangkapan layar yang menarik.

Padding40px
Latar
Pratinjau
javascript.ts
1function greet(name) {
2 // Say hello
3 const msg = `Hello, ${name}!`
4 console.log(msg)
5 return msg
6}

CSS & DESAIN SERUPA

Lihat semua
Pembuat Gradien CSS

Rancang gradien linear, radial, dan conic secara visual lalu salin CSS-nya.

Buka →
Glassmorphism CSS

Buat kode blur latar belakang dan batas tembus pandang secara langsung.

Buka →
Pembuat Box Shadow

💬 Komentar

?

Belum ada komentar. Jadilah yang pertama!

APA ITU Kode ke Gambar?

Ubah potongan kode menjadi gambar yang rapi dan mudah dibagikan: pilih bahasa, tema, gaya jendela, dan latar, lalu unduh PNG — siap untuk slide, dokumen, atau unggahan sosial.

Cara memakai

  1. Tempel kode ke area input dan pilih bahasa (JS/TS/Python/CSS/HTML/JSON/Bash/SQL/Rust/Go). Kata kunci, string, dan komentar diwarnai otomatis.
  2. Pilih dari 6 tema: Dracula, One Dark, GitHub Light, Solarized, Nord, dan Monokai — masing-masing dengan kepribadian warna yang khas.
  3. Aktifkan gaya jendela “macOS” untuk menambahkan tombol merah/kuning/hijau demi tampilan editor yang realistis. Nomor baris dapat diaktifkan terpisah.
  4. Penggeser “Padding” (16–80px) mengatur ruang antara blok kode dan latar. Pilih dari 5 latar gradien atau transparan.
  5. Setelah puas dengan pratinjau, klik “Unduh PNG” untuk gambar resolusi tinggi 2× — sempurna untuk Twitter, LinkedIn, atau artikel teknologi. “Salin Kode” menyalin teks biasa.

Pertanyaan yang sering diajukan

Bahasa pemrograman apa saja yang didukung?

JavaScript, TypeScript, Python, HTML, CSS, JSON, SQL, Bash, Java, dan Go dengan penyorotan sintaks.

Dalam format apa tangkapan layar yang diekspor?

PNG dengan resolusi 2×, cocok untuk blog, presentasi, dan media sosial.

Bisakah saya mengustomisasi latar dan gaya jendela?

Bisa. Beberapa tema warna, gaya macOS/tanpa bingkai, warna/gradien latar, nomor baris, dan padding.

Buat bayangan halus berlapis dengan pratinjau interaktif.

Buka →