Altın Konu 4BOOTSTRAP 4’DE RENK KODLARI VE CLASS’LAR

Fauda · 1 Tem 2021

BOOTSTRAP 4’DE RENK KODLARI VE CLASS’LAR

Bootstrap kullanmanın birçok faydasını biliyoruz. Bunlardan biride hazır class’ları kullanarak hem arkaplan rengi hem de yazı rengini verebiliyor olmamız. Bu yazımızda arkaplan ve yazı renklerini verebilmek için hangi class’ları kullanmamız gerektiğinden bahsedeceğiz. Birde bu class’ların hangi renk kodları ile oluşturulduğuna bakacağız.

ARKAPLAN RENGİ İÇİN KULLANABİLECEĞİMİZ CLASS’LAR VE RENK KODLARI

Arka plan rengi verebilmek için kullanabileceğimiz class isimleri ve renk kodları tablosu şu şekilde:

Class	Renk Kodları
bg-primary	#007bff
bg-info	#17a2b8
bg-danger	#dc3545
bg-warning	#ffc107
bg-success	#28a745
bg-secondary	#6c757d
bg-dark	#343a40
bg-light	#f8f9fa

Gördüğünüz gibi Bootstrap 4 ile arkaplan rengi verebilmek için 8 farklı class’ı kullanabiliyoruz.

YAZILAR İÇİN KULLANABİLECEĞİMİZ CLASS’LAR VE RENK KODLARI

Yazı rengi verebilmek için kullanabileceğimiz class isimleri ve renk kodları tablosu şu şekilde:

Class	Renk Kodları
text-primary	#007bff
text-info	#17a2b8
text-danger	#dc3545
text-warning	#ffc107
text-success	#28a745
text-secondary	#6c757d
text-dark	#343a40
text-muted	#6c757d
text-light	#f8f9fa
text-white	#ffffff

Gördüğünüz gibi Bootstrap 4 ile yazı rengi verebilmek için 10 farklı class’ı kullanabiliyoruz.

Not : .text-black-50 class’ı ile yazılara siyah rengi %50 şeffaflaştırarak verebiliriz. Aynı şekilde .text-white-50 class’ı ile yazılara beyaz rengi %50 şeffaflaştırarak verebiliriz.
.
Şu yazılar da ilginizi çekebilir.
Tüm Renk İsimleri ve Renk Kodları (Html, Css, Hex, Rgb)
Web Tasarımlarınızda Kullanabileceğiniz Tam 150 Farklı Renk Paleti

Umarım sizin için faydalı bir yazı olmuştur.