Web geliştiricisi, bir süre önce CBC logosunu css-doodle kullanarak kodlarken ilginç bir problemle karşılaştı. Logoyu oluşturmak için siyah bir arka plan üzerinde siyah kutular ve daireler üst üste yığılmıştı, bu da siyah elemanların arka planla birleşerek "görünmez" olmasını sağlıyordu. Ancak bu yöntem, arka plan rengi siyah olmadığında işe yaramıyordu ve siyah rengi kullanmadan veya daha fazla hesaplama gerektiren CSS maskeleri olmadan zarif bir çözüm bulmak zordu.
Geliştirici, bu soruna basit ve etkili bir çözüm olarak shader'ları kullanmayı keşfetti. css-doodle'ın gerçek zamanlı olarak görüntüler oluşturabilme yeteneği sayesinde, bu görüntüler doku olarak kullanılıp shader'lara beslenerek ek efektler uygulanabiliyor. Bu yeni yaklaşım, eski uygulamanın bir dokuya dönüştürülmesini ve tüm siyah piksellerin maskelenmesini içeriyor. Ayrıca, farklı karıştırma modlarının (blend modes) kullanımı da vurgulanıyor; özellikle "difference" karıştırma modu beyaz renkle birleştirildiğinde siyah-beyaz desenler oluşturmak için sıkça kullanılıyor.
Bu teknik, web grafiklerinde renk manipülasyonu ve dinamik görsel efektler oluşturma konusunda yeni kapılar açıyor. CSS'in sınırlamalarını aşarak daha esnek ve performanslı çözümler sunmasıyla dikkat çekiyor.
Web grafiklerinde siyah rengi dinamik olarak kaldırmak için shader'ların nasıl basit ve etkili bir çözüm sunduğunu gösteriyor.