Html renk kodları (Hex, Hsb, Rgb)

Bir tasarım hazırlarken şüphesiz en çok ihtiyaç duyduğumuz özellik renk kodlarıdır. Bir tasarım editörü kullanırken kendimize uygun rengi oluşturabilmemiz mümkündür ancak kimi zaman aklımızdan düşündüğümüzü editörden bir türlü tutturamayız veya birbirlerine olan uyumu görebilmemiz için karşılaştırma ihtiyacı duyarız. Tasarım programlarının böyle bir yeteneği yok henüz. Bu yüzden sizlere hex renk kodlarının tamamını bu yazı altında birleştirdim.

Hex’in kullanımı oldukça kolaydır # ile başlar 3 veya 6 karakterli olur. Ya rakam eklersiniz ya da harf eklersiniz. Bu 6 karakteri rastgele de deneyebilirsiniz. Çoğu zaman yaptığım çalışmalarda arka plan rengini deneyip çerçeveyi görebilmek amacıyla rastgele 6 karakterli numara va harfler kullanırım. Şu ana dek hiç boş çıkmadı. Bu karakterlerin nasıl kullanıldığını belki bilmiyorsunuzdur veya tesadüf eseri bu yazıyı okuyor olabilirsiniz diye kullanımı hakkında da ufak bilgi vereceğim biraz.

Html içinde kullanımı :

Aşağıdaki kodda p etiketinin arkaplan rengini (background-color) #006400 kodu ile renklendirdik.

Arka plan rengi koyu yeşil

Görüntüsü de bu şekilde olur.

Arka plan rengi koyu yeşil

 Ya divlerin (çerçeve) arkaplanları için kullanırız ya da yazılar için kullanırız bunları. Arkaplan için ilk demoda gördüğünüz  gibi background-color değerini kullandık. Yazılar için de color  değerini kullanmamız gerekiyor. Şimdi hem arkaplanı siyah ve yazıyı da beyaz yapalım.

Şu kod ile arkaplan siyah olacak ve yazı da beyaz olacak.
Siyah arka plan kodu örneği
style=”background-color:#renknumarası” kısmını alıp div içine yerleştirdiğinizde diviniz girmiş olduğunuz renk olur.

Arka plan rengi koyu yeşil

Arka plan rengi siyah

Sitenizin arka planını siyah yapmak için body etiketinin içine kodu eklemeniz yeterlidir.
Örnek:

 Bu örnekte p etiketini kullanarak yaptık. Bunu diğer bütün html etiketlere uyarlayabilmeniz mümkündür. Tek yapmanız gereken etiket isminden sonra style= tırnak şaretleri arasına background-color veya color yazmanız yeterlidir. Css içinde kullanımında da herhangi bir fark yoktur. Yine background-color:6 karakter veya color: 6 karakter şeklinde yapılır.

Bir de bu 6 karakter yerine kodun ismi kullanılarak ta denenebilir. Her bir numaraya atanmış olan isimler vardır. Örneğin #FFFFFF için black (siyah) kelimesini de kullanabilirsiniz. Aşağıdaki tabloda göreceğiniz gibi İsmi, Hex kodu ve görüntüsü bulunuyor. En solda bulunan İngilizce kelimeleri de bu numaraların yerine kullanabilirsiniz aynı şekilde.

Aşağıdaki listeden istediğinizi bulabilecek olsanız da bu yazıya bir de editör eklemek istedim sizlere. Hem HEX hem RGB hem de  HSB kodlarını tespit edebilirsiniz bu editör ile.

 
#000000 örnek kod gibi # ile başlayan kodları # olmadan alıp Twitter arkaplan kodları olarak kullanabilirsiniz. Profil düzenleme bölümünde tema rengine 6 rakamlık kodu yapıştırdığınızda profilinizin rengi değişir.