Modifikasi Text Shadow Untuk Memperbaiki Tampilan Teks

Modifikasi Text Shadow Untuk Memperbaiki Tampilan Teks - Penggunaan properti text-shadow pada sebuah karakter teks atau karakter simbol html sangat berpengaruh terhadap baik atau buruknya tampilan sebuah karakter, terutama dari segi kecocokan warna yang dipergunakan baik teks itu sendiri ataupun warna background dan warna shadow teks yang dipergunakan.

Beberapa contoh ringan dari hasil penggunaan properti text-shadow ini bisa dilihat pada contoh dibawah, dalam hal ini penggunaan warna teks dan shadow teks menggunakan warna yang agak sedikit gelap.

Tidak semua penggunaan teks shadow seperti contoh ini, kalian bisa membuat teks-teks tersebut seperti Blur, Emboss ataupun dengan gaya text-shadow lainnya.

Penggunaan warna teks dan shadow teks pada contoh tersebut mungkin tidak cocok dengan warna background template yang kalian pergunakan, dengan merubah nilai warna pada teks maupun text-shadow akan bisa memberikan kesuaian dengan warna backgrund yang dipergunakan.

Shadow

text-shadow: 0 -1px #000, 1px 0 #000, 0 1px #000, -1px 0 #000;

Shadow

text-shadow: 0px 1px 0px #fff, 0px 3px 0px rgba(0,0,0,0.5);

Shadow

text-shadow: 7px 7px 0px rgba(0,0,0,0.2);

Shadow

text-shadow: 5px 5px 0px rgba(255,255,255, 0.9), 9px 8px 0px rgba(0,0,0,0.2);

Shadow

text-shadow: 0px 14px 10px rgba(0,0,0,0.15),0px 24px 2px rgba(0,0,0,0.1),0px 34px 30px rgba(0,0,0,0.1);

Shadow

text-shadow: 10px 10px 0px #eee,20px 20px 0px #ddd,30px 30px 0px #ccc;

Shadow

text-shadow: 0px 15px 5px rgba(0,0,0,0.1),10px 20px 5px rgba(0,0,0,0.05),-10px 20px 5px rgba(0,0,0,0.05),0px 15px 20px rgba(0,0,0,0.01);

Penggunaan nilai peroperti text-shadow diatas hanya contoh sederhana, kalian bisa membuatnya lebih bagus dan sesuai dengan yang kalian inginkan.

Semoga bermanfaat dan Selamat Berkreasi.