Sebenarnya membuat CSS Text Shadow tidak hanya sebatas membuat bayangan pada teks saja, namun juga bisa menciptakan efek-efek spesial dengan memanfaatkan kemampuan propertinya yang dapat menerima value bayangan lebih dari satu. Internat Explorer tidak mendukung CSS Text Shadow, jadi kita harus membuka halaman ini dengan browser lain seperti Mozilla Firefox untuk melihat efeknya.

Efek Teks Cekung

Untuk membuat efek cekung, intinya adalah dengan membuat warna bayangan offset-X dan offset-Y negatif menjadi lebih gelap dibandingkan warna latar belakangnya. Sebaliknya, bayangan offset-X dan offset-Y positif diwarnai dengan warna yang lebih terang dibandingkan warna latar belakangnya. Hal ini akan menciptakan efek cekung pada teks.

Trik Menarik CSS

h2 {
  background:#4aacf7;
  color:#064475;
  text-shadow:1px 2px 1px #9ad2fe,-1px -2px 1px #1895f7;
}

Efek Teks Cembung

Untuk membuat efek teks cembung adalah dengan membuat warna bayangan offset-X dan offset-Y negatif menjadi lebih terang dibandingkan warna latar belakangnya. Sebaliknya, bayangan offset-X dan offset-Y positif diwarnai dengan warna yang lebih gelap. Hal ini akan menciptakan efek cembung pada teks. Terlebih lagi dengan penambahan detail pemberian warna yang lebih terang lagi pada dua sudut yang tersisa untuk menciptakan efek sedikit berkilau. Kinyis-kinyis...

Teks Cembung CSS

h2 {
  background:#3e6a06;
  color:#3e6a06;
  text-shadow:
    -1px -1px 1px #528e06,
    -1px -1px 3px #528e06,
    1px 1px 1px #243d05,
    1px 1px 3px #243d05,
    1px -1px 1px #eafed2,
    -1px 1px 1px #eafed2;
}