Efek visual yang tepat membuat antarmuka terasa hidup tanpa harus berlebihan. Section ini membahas borders dan sudut melengkung, outlines untuk focus, bayangan kotak dan teks, filters, serta batas wajar penggunaan efek agar performa dan keterbacaan tetap terjaga.

# Borders

Gambar garis tepi pada elemen dengan border: lebar, gaya, warna, shorthand, dan pengaturan per sisi.

Buka → # Border Radius

Melengkungkan sudut elemen dengan border-radius: satu nilai, per sudut, lingkaran, pil, hingga elips.

Buka → # Outlines

Menggambar garis di luar tepi elemen dengan outline untuk penanda fokus yang ramah aksesibilitas.

Buka → # Box Shadow

Memberi kedalaman pada elemen dengan box-shadow: offset, blur, spread, bayangan inset, dan bayangan bertingkat.

Buka → # Text Shadow

Menambahkan bayangan pada teks dengan text-shadow untuk keterbacaan di latar ramai dan untuk efek gaya.

Buka → # Filters

Menerapkan efek grafis seperti blur, brightness, dan drop-shadow pada elemen dengan properti filter.

Buka → # Visual Effects Best Practices

Menakar penggunaan efek visual: batas wajar, performa animasi, token konsisten, dan aksesibilitas.

Buka →