CSS’de kullanacağımız renkler ancak özel bazı tanımlamalarla mümkün. Bu özel renk tanımlamalarıyla yazı, çerçeve v.b nesnelerin arkaplan, yazı rengi, çerveçe rengi gibi tanımlamaları css’in bu makalede göreceğiniz özel renk tanımlamaları ilemümkündür.
Alttaki tabloda css’de renk tanımlamalarının nasıl yapıldığı ve örneği yer almaktadır.
Formatı | Sözdizimi | Örneği |
---|---|---|
Hex Kodu | #RRGGBB | p{color:#FF0000;} |
Kısa Hex Kodu | #RGB | p{color:#6A7;} |
RGB % | rgb(rrr%,ggg%,bbb%) | p{color:rgb(50%,50%,50%);} |
RGB kesinliği | rgb(kkk,yyy,sss) | p{color:rgb(0,0,255);} |
anahtar kelime | aqua, black, etc. | p{color:teal;} |
Yukarıdaki tabloya ait detaylı bilgiler içinde makalenin devamına gözatmanızı öneririm.
CSS Renkleri – Heksadesimal Kodları:
Heksadesimal 6 basamak karakterin birleşimi sonucu oratay çıkan renk kodudur. İlk 2 karakter kırmızı rengin değerini(KK) , sonraki 2 karakter yeşilin değerini(BB) ve son 2 basamak ise mavi değerini(MM) temsil eder.
Heksadesimal değerini bilgisayar yazılımı olan Adobe Photoshop, Jasc Paintshop Pro ve Advanced Paint Brush gibi grafik yazılımlarındada kullanabilirsiniz.
Heksadesimal renk kodları diyez işareti ile başlamaktadır.
Renk | Heksadesimal Renk Kodu |
---|---|
#000000 | |
#FF0000 | |
#00FF00 | |
#0000FF | |
#FFFF00 | |
#00FFFF | |
#FF00FF | |
#C0C0C0 | |
#FFFFFF |
CSS Renkleri – Kısa Heksadesimal Kodları:
Heksadesimal renk kodlarında 6 karakterlik bir kullanıl olduğu gibi kısa bir şekilde 3 karakterlede yazabilirsiniz.; Örnek: #6A7 – #66AA77 her iki şekildede yazıl.
Heksadesimal değerlerin css’deki önemi kadar Photoshop, CorelDraw, Fireworks, Illustrator v.b Grafik tasarım yazılımlarındada büyük bir öneme sahiptir ve çok sık kullanılırlar.
Heksadesimal renk kodları diyez işareti ile başlamaktadır.
Renk | Heksadesimal Renk Kodu |
---|---|
#000 | |
#F00 | |
#0F0 | |
#0FF | |
#FF0 | |
#0FF | |
#F0F | |
#FFF |
CSS Renkleri – RGB Değerleri:
Bu renk değerlerini kullanabilmek için rgb() özelliği kullanılmalıdır. Bu özellik üç değer almaktadır bunlar sırasıyla kırmızı, yeşil, ve mavi renklerinin değerleridir. 0 ile 255 arasında tamsayı değer alabilmektedir..
Örnek olarak RGB özelliğinin kullanımı için alttaki tabloya gözatabilirsiniz.
Renk | RGB Renk Kodu |
---|---|
rgb(0,0,0) | |
rgb(255,0,0) | |
rgb(0,255,0) | |
rgb(0,0,255) | |
rgb(255,255,0) | |
rgb(0,255,255) | |
rgb(255,0,255) | |
rgb(192,192,192) | |
rgb(255,255,255) |
Güvenli tarayıcı renkleri;
Alltaki talboda 216 adet web tarafından kullanılması önerilen renk paleti yer almaktadır. Bu renklerin değerleri 000000(siyah) ile FFFFFF(beyaz) arasında değişmektedir.
000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF |
CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |