Buat landing page retro gaya 80-an dengan AI dalam 7 menit
Halaman HTML/CSS siap pakai dengan palet neon, font piksel, dan efek CRT - langsung di browser, tanpa instalasi software
- 1.Buka Claude.ai, masuk ke akun (registrasi gratis via email). Jika layanan tidak tersedia di wilayah Anda, gunakan chatbot alternatif apa pun dengan kemampuan membuat kode - ChatGPT atau Gemini juga cocok.
Paket gratis Claude memberi akses ke model dasar; itu cukup untuk membuat HTML/CSS.
Claude ↗Tentang alat ini - 2.Buat chat baru dan tempel prompt di bawah. Ganti [TEMA] dengan tema halaman Anda (misalnya, «portofolio fotografer», «landing page untuk kafe», «pengumuman podcast»), dan [ZAGOLOVOK] dengan judul utama halaman.
Semakin spesifik deskripsi tema dan konten, semakin sedikit yang harus Anda edit manual.
Claude ↗Tentang alat iniPromptBuat website retro satu halaman bergaya arcade 1980-an. Tema: [TEMA]. Judul utama: [ZAGOLOVOK]. Sertakan: bagian hero dengan judul neon, bagian about, dan footer dengan info kontak. Persyaratan gaya: background #0A0A0F, aksen neon oranye #FE9901, aksen turquoise acid #00F0FF, teks warm white. Gunakan 'Press Start 2P' dari Google Fonts untuk judul, monospace untuk teks isi. Tambahkan efek CRT scanline dengan CSS, gaya tombol piksel dengan inset shadow, dan batas gaya ASCII di sekitar bagian. Output sebagai satu file HTML mandiri dengan CSS inline. Sertakan link Google Fonts. Halaman harus fully responsive.
Apa fungsi prompt iniPrompt dalam bahasa Inggris - agar Claude lebih akurat memahami persyaratan gaya. Ganti [TEMA] dengan tema halaman (misalnya, «personal blog about retro games»), [ZAGOLOVOK] dengan judul utama Anda. Parameter lainnya (palet, font, efek) tidak perlu diubah. - 3.Tunggu hingga kode selesai dibuat (biasanya 30 - 60 detik). Salin seluruh blok HTML - klik tombol Copy di pojok kanan atas blok kode.
Jika kode terbagi menjadi beberapa blok, salin satu per satu ke dalam satu file.
Claude ↗Tentang alat ini - 4.Buka editor teks apa pun (Notepad di Windows, TextEdit di Mac dalam mode «Plain Text»). Tempel kode. Simpan file sebagai retro.html - yang penting ekstensi .html, bukan .txt.
Di Notepad saat menyimpan, pilih «Semua file» di kolom «Tipe file», jika tidak akan tersimpan sebagai .txt.
- 5.Klik dua kali file retro.html yang tersimpan - akan terbuka di browser. Anda akan melihat halaman retro dengan aksen neon, efek CRT, dan font piksel.
File berjalan offline, kecuali font Press Start 2P - dimuat dari Google Fonts (butuh internet saat pertama dibuka).
- 6.Jika perlu memperbaiki sesuatu - kembali ke chat dengan Claude dan tulis: «Ubah background menjadi dark purple dan tambahkan animasi pixel-art bintang di bagian hero». Claude akan memberikan kode yang diperbarui. Ganti isi retro.html dan simpan kembali.
Lakukan edit satu per satu - hasilnya lebih dapat diprediksi.
Claude ↗Tentang alat ini
💰 Berapa biaya untuk mengikutinyaharga per 2026-11
- gratisClaude FreePaket gratis memberikan jumlah pesan terbatas per hari - cukup untuk membuat dan 1 - 2 kali edit HTML/CSS.
Coba dan jadilah yang pertama menandai
Kenapa hari ini
1
video kreator dalam 48 jam
9,5 rb
total tayangan
cossa.ruweb
Resep minggu ini ke email
Layanan AI berubah cepat - antarmuka dan batas gratis bisa berbeda dari yang dijelaskan.