Gradiend, özellikle front-end tasarımcıların bir çalışma hazırlarken ihtiyaç duyduğu gradient yapısını online olarak görüntüleyerek hazırlama imkanı sunan bir web aracıdır. Hazırladığım bu araç hakkında birkaç ipucu eklemek ve sizlere sunmak istedim.
Gradiend Nedir?
Gradiend bir css gradient oluşturucudur. Bu oluşturucu, seçtiğiniz iki renk arasındaki geçişi sizlere anlık olarak gösterir ve projenizde kullanacağınız gradient yapısını görüntüleme ve düzenleme imkanı sunar. Oluşturduğunuz geçişe ait kodları kopyalamanıza olanak sağlar.
Gradiend Neler Sunuyor?
Tam sayfa geçişi görüntüleme imkanı
Hazırladığınız geçiş minik bir pencerede sizlere sunulmuyor. Site arkaplanı üzerinde gerçekleştirilen geçiş, daha iyi sonuçlar üretebilmenize olanak tanıyor.
Linear ya da Radial arasında hızlı geçiş
Eklenen minik butonlar yardımı ile bir yerden başka bir yere veya dıştan içe doğru bir gradient oluşturabilirsiniz.
Linear alt seçimleri
- Eğer bir yerden başka bir yere doğru bir geçiş uygulamak isterseniz, 0°, 45°, 90°, 135°, 180°, 225°, 270° ve 315° gibi temel açıları hızlı bir şekilde seçebilirsiniz.
- Mousewheel'i kaydırarak açıyı 5'er derece oynatabilirsiniz.
- Doğrudan açı belirtebilirsiniz.
Renk Tekerleri
Renk seçerken renk tekerlerini kullanabilirsiniz. Bu tekerlerde yaptığınız değişiklikler anlık olarak arkaplanda görüntülenecektir.
Renk Seçiciler
Sayfanın en altında yer alan renk seçicilerde toplam 20 ana renk ve 200 alt renge kadar günümüzde popüler material renklerini seçebilirsiniz.
Kod Alanı
- Kod alanı açık bir şekilde çalışma yapabilirsiniz. Kodda anlık değişiklikleri görüntüleyebilirsiniz.
- Kodlar özel olarak renklendirilmiştir.
- Kod içerisindeki renklerin yanında seçili rengin düz olarak görünmesi sağlanmıştır.
- Kodu kopyala butonu sayesinde kodu alt alta kopyalama imkanı tanır. (5 satır)
- Kodu tek satır kopyala butonu sayesinde ise kodu tek bir satırda kopyalama imkanınız vardır. Bir kısım geliştiriciler her div için tek satır ayırdıklarından bu sayede işlerini hızlandırabilirler.
Ekstra
Proje hakkında geliştirilmesini veya değiştirilmesini istediğiniz alanları bana mail olarak, bu makalenin altından, sosyal platformlardan veya menüdeki iletişim alanından gönderirseniz güncellemelerde eklemeler yapacağım :) Olumlu veya olumsuz yorumlarınızı bekliyorum. İyi çalışmalar dilerim