Kembali ke Tantangan
Tantangan HTML & CSS

Membuat Kartu Profil

Siswa membuat kartu profil sederhana yang bisa dipakai sebagai komponen awal halaman personal.

Pemula 45 menit

Skill yang Dilatih

  • Struktur HTML
  • CSS card
  • Warna
  • Spacing

Alat yang Dibutuhkan

  • Editor kode
  • Browser
  • Foto atau avatar placeholder

Instruksi Tantangan

  1. Buat file HTML dengan struktur dasar.
  2. Tambahkan card berisi foto, nama, deskripsi singkat, hobi, dan tombol kontak.
  3. Gunakan CSS untuk mengatur ukuran card, warna, jarak, border, dan bayangan.
  4. Pastikan card tetap rapi saat dibuka di layar kecil.

Checklist Sebelum Submit

  • Ada foto atau avatar.
  • Nama dan deskripsi mudah dibaca.
  • Tombol memiliki warna yang jelas.
  • Spacing antar elemen konsisten.
  • Tampilan tidak melebar berlebihan di mobile.

Submit Karya

Kirim hasil karya ke WhatsApp Mux. Sertakan beberapa hal ini agar mentor mudah memberi feedback.

  • Screenshot hasil akhir
  • Link CodePen/Replit/GitHub jika ada
  • Catatan bagian tersulit yang berhasil diselesaikan
Kirim via WhatsApp