{"id":15161,"date":"2018-03-27T17:08:25","date_gmt":"2018-03-27T10:08:25","guid":{"rendered":"https:\/\/www.pugam.com\/?p=15161"},"modified":"2018-03-28T06:52:48","modified_gmt":"2018-03-27T23:52:48","slug":"12-contoh-css-text-shadow-untuk-web-design","status":"publish","type":"post","link":"https:\/\/www.pugam.com\/15161\/12-contoh-css-text-shadow-untuk-web-design\/","title":{"rendered":"12 Contoh CSS Text Shadow untuk Web Design"},"content":{"rendered":"

\"12<\/p>\n

Salah satu properti CSS yang sangat mudah untuk dikreasikan adalah Text Shadow<\/strong> atau bayangan pada teks. Anda dapat menerapkan banyak gaya text-shadow pada setiap tulisan agar terlihat lebih indah dan menarik.<\/p>\n

Dalam artikel ini, saya akan menyajikan 12 contoh CSS text shadow yang bisa Anda coba.<\/p>\n

Dasar CSS Text Shadow<\/h2>\n

Sintaks untuk membuat text-shadow sangatlah sederhana. Perhatikan di bawah ini:<\/p>\n

text-shadow: horizontal-offset vertical-offset blur color;<\/pre>\n

Ada empat variabel di dalam sintaks text-shadow. Dua yang pertama digunakan untuk mengatur posisi bayangan, variabel ketiga untuk mengatur nilai blur dan variabel keempat untuk mengatur warna bayangan.<\/p>\n

Jika saya membuat contoh kode seperti ini:<\/p>\n

text-shadow: 2px 4px 3px rgba(0,0,0,0.3);<\/pre>\n

Maka hasilnya akan menjadi seperti ini:<\/p>\n

\"12<\/p>\n

Kenapa Menggunakan Kode Warna RGBA?<\/h2>\n

Tidak harus menggunakan kode warna RGBA, Anda dapat menggunakan kode warna apapun yang berlaku di CSS.<\/p>\n

Kode warna RGBA digunakan jika Anda menginginkan komposisi warna yang lebih kompleks. Selain itu, dengan RGBA Anda dapat mengatur opacity dari warna yang digunakan langsung di dalam kode warna.<\/p>\n

12 Contoh CSS Text Shadow<\/h2>\n

Saya sudah membuat 12 contoh CSS untuk text-shadow di CodePen. Anda tinggal menyalin kode yang ingin digunakan, atau bisa juga dimodifikasi kembali sesuai dengan kebutuhan Anda.<\/p>\n

See the Pen on CodePen<\/a>.<\/p>