Penghasil Text Shadow
CSS Text Shadow Generator mengatur offset, blur, warna, dan opacity text-shadow dengan pratinjau langsung, serta memungkinkan Anda menumpuk beberapa lapisan bayangan untuk efek glow, outline, dan teks 3D.
Tentang alat ini
CSS Text Shadow Generator mengatur offset, blur, warna, dan opacity text-shadow dengan pratinjau langsung, serta memungkinkan Anda menumpuk beberapa lapisan bayangan untuk efek glow, outline, dan teks 3D.
Cara menggunakan
- Atur offset horizontal dan vertikal serta blur.
- Pilih warna dan opacity bayangan, serta warna dan ukuran teks.
- Klik Add Layer untuk menambah lapisan bayangan; Reset Layers untuk mulai dari awal.
- Klik Copy CSS.
Perlu diketahui
- Sintaks text-shadow: offset-x offset-y blur-radius color.
- Berbeda dengan box-shadow, text-shadow tidak memiliki nilai spread atau kata kunci inset.
- Beberapa bayangan dipisahkan dengan koma, dan bayangan pertama digambar paling atas.
- Bayangan dengan offset nol dan blur menghasilkan efek glow.
- Menumpuk beberapa offset 1 px menghasilkan tampilan 3D atau letterpress.
Berjalan sepenuhnya di browser Anda — apa pun yang Anda masukkan tidak diunggah atau disimpan.
Pertanyaan umum
Bagaimana cara menambahkan bayangan pada teks di CSS?
Gunakan text-shadow, misalnya text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
Bagaimana cara membuat teks bercahaya (glow)?
Gunakan offset nol dengan blur dan warna terang, misalnya text-shadow: 0 0 8px #1db954; tumpuk beberapa lapisan untuk glow yang lebih kuat.
Bisakah saya memakai lebih dari satu text-shadow?
Bisa. Pisahkan bayangan dengan koma; alat ini menambahkan setiap lapisan untuk Anda.
Apakah text-shadow memengaruhi keterbacaan?
Bayangan tipis bisa membantu keterbacaan di atas gambar, tetapi bayangan tebal justru mengurangi kejelasan — periksa kontrasnya dengan contrast checker.