Arkadaşlar merhaba, son zamanlarda bir projede karanlık mod geçişi yaparken buton tasarımında takıldım. Normalde projede çoğu şeyi CSS değişkenleriyle hallettim, arka planlar, metin renkleri falan sorunsuz çalışıyor. Ama butonlara gelince işler karıştı. Özellikle primary aksiyon butonlarında, karanlık modda arka plan rengiyle buton rengi birbirine giriyor ya da kontrast düşüklüğü oluyor. Siz bu durumu nasıl çözüyorsunuz?
Ben genelde butonun kendisinde fill (dolu) ve outline (çerçeveli) gibi iki farklı stil kullanıyorum. Aydınlık modda fill butonlar gayet hoş dururken, karanlık modda aynı buton bazen göz yoruyor ya da yeterince belirgin olmuyor. Örneğin mavi bir primary butonu karanlık modda daha açık bir tona çekmek zorunda kalıyorum ama o zaman da "bu buton hala primary mi" sorusu akla geliyor. Siz butonun anlamını (primary, secondary, danger vb.) korurken renk paletini nasıl optimize ediyorsunuz?
Bir de hover ve active durumları var tabii. Karanlık modda butona hover olduğunda hafif bir parlaklık artışı mı vermeli, yoksa tam tersi gölge mi eklemeli? Ben denediğimde, karanlık modda hover efekti olarak butonun kenarlarına ince bir glow eklemenin daha iyi sonuç verdiğini gördüm. Ama bu sefer de outline butonlarda işler karışıyor, çünkü outline butonun zaten bir çerçevesi var, glow ekleyince çerçeve kalınlaşıyormuş gibi algılanıyor. Sizin bu konuda önerileriniz var mı? Özellikle karanlık modda kullanıcı deneyimini bozmadan buton tasarımını nasıl sade ve etkili tutuyorsunuz?
Ben genelde butonun kendisinde fill (dolu) ve outline (çerçeveli) gibi iki farklı stil kullanıyorum. Aydınlık modda fill butonlar gayet hoş dururken, karanlık modda aynı buton bazen göz yoruyor ya da yeterince belirgin olmuyor. Örneğin mavi bir primary butonu karanlık modda daha açık bir tona çekmek zorunda kalıyorum ama o zaman da "bu buton hala primary mi" sorusu akla geliyor. Siz butonun anlamını (primary, secondary, danger vb.) korurken renk paletini nasıl optimize ediyorsunuz?
Bir de hover ve active durumları var tabii. Karanlık modda butona hover olduğunda hafif bir parlaklık artışı mı vermeli, yoksa tam tersi gölge mi eklemeli? Ben denediğimde, karanlık modda hover efekti olarak butonun kenarlarına ince bir glow eklemenin daha iyi sonuç verdiğini gördüm. Ama bu sefer de outline butonlarda işler karışıyor, çünkü outline butonun zaten bir çerçevesi var, glow ekleyince çerçeve kalınlaşıyormuş gibi algılanıyor. Sizin bu konuda önerileriniz var mı? Özellikle karanlık modda kullanıcı deneyimini bozmadan buton tasarımını nasıl sade ve etkili tutuyorsunuz?