CSS

10 Adet CSS ile Yapılmış Buton Kütüphanesi

10 Adet CSS ile Yapılmış Buton Kütüphanesi
Hakan
Yazan Hakan

Düşündüğümüzde internet hayatında birçok alanda kullanıyoruz aslında. Alışveriş sepetlerine ürün eklemek, bir hizmet hakkında daha fazla bilgi edinmek, onaylama ve eposta göndermek gibi birçok yerde kullanıyoruz.

Bu yüzden bir site tasarlanırken butonlarada çok önem verilir çünkü kullanıcının daha çok etkileşimde bulunması istenir. Bu nedenle hem güzel bir tasarıma sahip hemde bazı görsel ipuçları ( ikonlar ) veren butonları seçmemiz gerekir.

Bunları düşünerek sizler için 10 adet css ile yapılmış buton kütüphanelerini buldum. Çok rahat kullanımı ve farklı tasarımlarla bir çok alanda kullanabileceğinize eminim.

Bttn.css

Bttn.css bize 6 farklı renk ve 4 farklı boyutla, 13 farklı buton tipi sunuyor. Tüm buton stilleri basit sınıf adlarıyla çağrılmış ve kolay kullanıma sahiptir.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Bttn.css

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Bttn.css

 


Buttons

24 Farklı buton tipiyle büyük bir buton kütüphanesi diyebiliriz. Üstelik 10 farklı renk tipi ve 4 farklı boyutla bizlere sunulmuş. Hover efektleri ve tıklama efektleride butonlara ayrı bi hava katmış zaten.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Buttons

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Buttons

 


Pushy Buttons

3d buton arıyorsanız bunlar tam size göre. 3 farklı renk seçeneği ve 4 farklı boyutuyla kolay bir kullanımı var.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Pushy Buttons

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Pushy Buttons

 


Btns.css

11 farklı renk ve 8 farklı buton tipiyle güzel bir buton kütüphanesi daha. Özellikle transform efektleriyle çok güzel butonlar var.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Btns.css

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Btns.css

 


Buttons

Font awesome ikonları kullanılan butonlar ve daha birçok farklı şekilde butonlar. 6 farklı renk  seçeneği var.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Buttons #2

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Buttons #2

 


Press.css

Google’ın materyal tasarım yönergelerini baz alarak oluşturulmuş bu harika  ve sade butonlar projelerinizde çok işinize yarıcaktır. 20 farklı renk seçeneği, birçok farklı buton tipi ve boyut özelliği var. Yani kısacası adamlar herşeyi düşünmüş.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Press.css

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Press.css

 


FontAwesome İkonları İle Yapılmış Hover Efektli CSS3 Butonlar

Diğerlerine bakaraktan bu bi site değil. Codepen üzerinde yapılmış güzel bir buton koleksiyonu. FontAwesome ikonları kullanılarak, css butonlara hover efektleri verilmiş ve gerçekten güzel ve modern olmuş diyebilirim.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Codepen.io da Yapılmış Buton Koleksiyonu

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Codepen.io da Yapılmış Buton Koleksiyonu

 


Bootstrap İçin Sosyal Medya Butonlar

Lipis tarafından hazırlanmış ve bootstrap sistemiyle uyumlu bi şekilde çalışan birbirinden güzel sosyal medya butonları. 21 farklı sosyal medya butonu ve butonlarında 4 farklı boyutu bulunuyor. Sadece bu kadar değil bu butonları Sign in With … yazısıyla beraber kullanabilir ayrıyetten sadece ikon olarakda kullanabilirsiniz.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Bootstrap İçin Sosyal Medya Butonlar

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Bootstrap İçin Sosyal Medya Butonlar

 


Radioactive Buttons

Radyoaktiflik hissi veren bu güzel düğmeler projelerinizi ilgi çekici yanı olabilir. Güzel hover efektleriyle renk değişimleri görsellik açısından çok güzel oluyor.

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Radioactive Buttons

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Radioactive Buttons

 


Beautons

Sade düğmeler arıyorsanız buraya bakabilirsiniz. Farklı boyut ve stiller vardır.

 

10 Adet CSS ile Yapılmış Buton Kütüphanesi - Beautons

10 Adet CSS ile Yapılmış Buton Kütüphanesi – Beautons

Yazar hakkında

Hakan

Hakan

WebYardimci.com'un kurucusu ve yazarı...

3 Yorumlar

Yorum Yap

Ücretsiz 1 Yıllık .design Alan Adı Almak İçin:Buraya Tıklayarak Gidebilirsin
v-pills