HTML Text Color - Metin Rengi
HTML, metninize renk eklemek çok kolaydır. Bu kısa makalede, Hex renk kodları, HTML renk adları, RGB ve HSL değerleri kullanarak HTML metninizin rengini nasıl değiştireceğinizi ele alacağız.
Hex(Onaltılık renk) Kodlarını Kullanarak metne Renk Verme
HTML metnini renklendirmenin en yaygın yolu, onaltılık renk kodları kullanmaktır (kısaca Hex kod). Renklendirmek istediğiniz metin öğesine (aşağıdaki örnekte bir paragraf) bir stil niteliği ekleyin ve renk özelliğini Hex kodunuzla kullanın. Aynı yöntemle RGB ve HSL renk kodlarını ekleyebilirsiniz.
<p style="color:#87cefa";>Mavi paragraf metni</p>
<p style="color:#ffa500";>Turuncu parağraf metni</p>
ÇIKTI:
Mavi paragraf metni
Turuncu parağraf metni
HTML Renk Adlarını Kullanarak Metne Renk Verme
Web sitenizin metnini renklendirmenin başka bir yolu da bir HTML renk adı kullanmaktır. HTML kodu benzerdir, sadece önceki adımdaki Hex kodunu kullanmak istediğiniz rengin adıyla (örneğimizde Açık Mavi) değiştirin. 140 adet renk adı belirlenmiştir. Bu renkler güvenlidir, yani bütün tarayıcılarda aynı gösterilir.
<p style="color:lightskyblue">Mavi paragraf metni</p>
<p style="color:orange">Turuncu parağraf metni</p>
Mavi paragraf metni
Turuncu parağraf metni
RED HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
lightsalmon | #FFA07A | rgb(255,160,122) | |
salmon | #FA8072 | rgb(250,128,114) | |
darksalmon | #E9967A | rgb(233,150,122) | |
lightcoral | #F08080 | rgb(240,128,128) | |
indianred | #CD5C5C | rgb(205,92,92) | |
crimson | #DC143C | rgb(220,20,60) | |
firebrick | #B22222 | rgb(178,34,34) | |
red | #FF0000 | rgb(255,0,0) | |
darkred | #8B0000 | rgb(139,0,0) |
ORANGE HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
coral | #FF7F50 | rgb(255,127,80) | |
tomato | #FF6347 | rgb(255,99,71) | |
orangered | #FF4500 | rgb(255,69,0) | |
gold | #FFD700 | rgb(255,215,0) | |
orange | #FFA500 | rgb(255,165,0) | |
darkorange | #FF8C00 | rgb(255,140,0) |
WHITE HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
white | #FFFFFF | rgb(255,255,255) | |
snow | #FFFAFA | rgb(255,250,250) | |
honeydew | #F0FFF0 | rgb(240,255,240) | |
mintcream | #F5FFFA | rgb(245,255,250) | |
azure | #F0FFFF | rgb(240,255,255) | |
aliceblue | #F0F8FF | rgb(240,248,255) | |
ghostwhite | #F8F8FF | rgb(248,248,255) | |
whitesmoke | #F5F5F5 | rgb(245,245,245) | |
seashell | #FFF5EE | rgb(255,245,238) | |
beige | #F5F5DC | rgb(245,245,220) | |
oldlace | #FDF5E6 | rgb(253,245,230) | |
floralwhite | #FFFAF0 | rgb(255,250,240) | |
ivory | #FFFFF0 | rgb(255,255,240) | |
antiquewhite | #FAEBD7 | rgb(250,235,215) | |
linen | #FAF0E6 | rgb(250,240,230) | |
lavenderblush | #FFF0F5 | rgb(255,240,245) | |
mistyrose | #FFE4E1 | rgb(255,228,225) |
GRAY HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
gainsboro | #DCDCDC | rgb(220,220,220) | |
lightgray | #D3D3D3 | rgb(211,211,211) | |
silver | #C0C0C0 | rgb(192,192,192) | |
darkgray | #A9A9A9 | rgb(169,169,169) | |
gray | #808080 | rgb(128,128,128) | |
dimgray | #696969 | rgb(105,105,105) | |
lightslategray | #778899 | rgb(119,136,153) | |
slategray | #708090 | rgb(112,128,144) | |
darkslategray | #2F4F4F | rgb(47,79,79) | |
black | #000000 | rgb(0,0,0) |
BROWN HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
cornsilk | #FFF8DC | rgb(255,248,220) | |
blanchedalmond | #FFEBCD | rgb(255,235,205) | |
bisque | #FFE4C4 | rgb(255,228,196) | |
navajowhite | #FFDEAD | rgb(255,222,173) | |
wheat | #F5DEB3 | rgb(245,222,179) | |
burlywood | #DEB887 | rgb(222,184,135) | |
tan | #D2B48C | rgb(210,180,140) | |
rosybrown | #BC8F8F | rgb(188,143,143) | |
sandybrown | #F4A460 | rgb(244,164,96) | |
goldenrod | #DAA520 | rgb(218,165,32) | |
peru | #CD853F | rgb(205,133,63) | |
chocolate | #D2691E | rgb(210,105,30) | |
saddlebrown | #8B4513 | rgb(139,69,19) | |
sienna | #A0522D | rgb(160,82,45) | |
brown | #A52A2A | rgb(165,42,42) | |
maroon | #800000 | rgb(128,0,0) |
YELLOW HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
lightyellow | #FFFFE0 | rgb(255,255,224) | |
lemonchiffon | #FFFACD | rgb(255,250,205) | |
lightgoldenrodyellow | #FAFAD2 | rgb(250,250,210) | |
papayawhip | #FFEFD5 | rgb(255,239,213) | |
moccasin | #FFE4B5 | rgb(255,228,181) | |
peachpuff | #FFDAB9 | rgb(255,218,185) | |
palegoldenrod | #EEE8AA | rgb(238,232,170) | |
khaki | #F0E68C | rgb(240,230,140) | |
darkkhaki | #BDB76B | rgb(189,183,107) | |
yellow | #FFFF00 | rgb(255,255,0) |
GREEN HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
lawngreen | #7CFC00 | rgb(124,252,0) | |
chartreuse | #7FFF00 | rgb(127,255,0) | |
limegreen | #32CD32 | rgb(50,205,50) | |
lime | #00FF00 | rgb(0.255.0) | |
forestgreen | #228B22 | rgb(34,139,34) | |
green | #008000 | rgb(0,128,0) | |
darkgreen | #006400 | rgb(0,100,0) | |
greenyellow | #ADFF2F | rgb(173,255,47) | |
yellowgreen | #9ACD32 | rgb(154,205,50) | |
springgreen | #00FF7F | rgb(0,255,127) | |
mediumspringgreen | #00FA9A | rgb(0,250,154) | |
lightgreen | #90EE90 | rgb(144,238,144) | |
palegreen | #98FB98 | rgb(152,251,152) | |
darkseagreen | #8FBC8F | rgb(143,188,143) | |
mediumseagreen | #3CB371 | rgb(60,179,113) | |
seagreen | #2E8B57 | rgb(46,139,87) | |
olive | #808000 | rgb(128,128,0) | |
darkolivegreen | #556B2F | rgb(85,107,47) | |
olivedrab | #6B8E23 | rgb(107,142,35) |
CYAN HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
lightcyan | #E0FFFF | rgb(224,255,255) | |
cyan | #00FFFF | rgb(0,255,255) | |
aqua | #00FFFF | rgb(0,255,255) | |
aquamarine | #7FFFD4 | rgb(127,255,212) | |
mediumaquamarine | #66CDAA | rgb(102,205,170) | |
paleturquoise | #AFEEEE | rgb(175,238,238) | |
turquoise | #40E0D0 | rgb(64,224,208) | |
mediumturquoise | #48D1CC | rgb(72,209,204) | |
darkturquoise | #00CED1 | rgb(0,206,209) | |
lightseagreen | #20B2AA | rgb(32,178,170) | |
cadetblue | #5F9EA0 | rgb(95,158,160) | |
darkcyan | #008B8B | rgb(0,139,139) | |
teal | #008080 | rgb(0,128,128) |
BLUE HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
powderblue | #B0E0E6 | rgb(176,224,230) | |
lightblue | #ADD8E6 | rgb(173,216,230) | |
lightskyblue | #87CEFA | rgb(135,206,250) | |
skyblue | #87CEEB | rgb(135,206,235) | |
deepskyblue | #00BFFF | rgb(0,191,255) | |
lightsteelblue | #B0C4DE | rgb(176,196,222) | |
dodgerblue | #1E90FF | rgb(30,144,255) | |
cornflowerblue | #6495ED | rgb(100,149,237) | |
steelblue | #4682B4 | rgb(70,130,180) | |
royalblue | #4169E1 | rgb(65,105,225) | |
blue | #0000FF | rgb(0,0,255) | |
mediumblue | #0000CD | rgb(0,0,205) | |
darkblue | #00008B | rgb(0,0,139) | |
navy | #000080 | rgb(0,0,128) | |
midnightblue | #191970 | rgb(25,25,112) | |
mediumslateblue | #7B68EE | rgb(123,104,238) | |
slateblue | #6A5ACD | rgb(106,90,205) | |
darkslateblue | #483D8B | rgb(72,61,139) |
PURPLE HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
lavender | #E6E6FA | rgb(230,230,250) | |
thistle | #D8BFD8 | rgb(216,191,216) | |
plum | #DDA0DD | rgb(221,160,221) | |
violet | #EE82EE | rgb(238,130,238) | |
orchid | #DA70D6 | rgb(218,112,214) | |
fuchsia | #FF00FF | rgb(255,0,255) | |
magenta | #FF00FF | rgb(255,0,255) | |
mediumorchid | #BA55D3 | rgb(186,85,211) | |
mediumpurple | #9370DB | rgb(147,112,219) | |
blueviolet | #8A2BE2 | rgb(138,43,226) | |
darkviolet | #9400D3 | rgb(148,0,211) | |
darkorchid | #9932CC | rgb(153,50,204) | |
darkmagenta | #8B008B | rgb(139,0,139) | |
purple | #800080 | rgb(128,0,128) | |
indigo | #4B0082 | rgb(75,0,130) |
PİNK HTML COLOR NAMES
Color | HTML / CSS Color Name |
Hex Code #RRGGBB |
Decimal Code (R,G,B) |
---|---|---|---|
pink | #FFC0CB | rgb(255,192,203) | |
lightpink | #FFB6C1 | rgb(255,182,193) | |
hotpink | #FF69B4 | rgb(255,105,180) | |
deeppink | #FF1493 | rgb(255,20,147) | |
palevioletred | #DB7093 | rgb(219,112,147) | |
mediumvioletred | #C71585 | rgb(199,21,133) |
- HTML
- CSS
- PHP
- JQUERY
- PHOTOSHOP
- JavaScript
- Web Dünyası
- Linux
- MİTHRİL FRAMEWORK
- Laravel
- Git
- React
- HTML LİNK(Bağlantı)EKLEME - LİNK VERME
- HTML YAZI VE RESİM ORTALAMA
- HTML RESME LİNK VERME
- HTML FORM OLUŞTURMA
- CSS YATAY MENÜ YAPIMI
- HTML RESİM EKLEME
- CSS (BOYUT) GENİŞLİK VE YÜKSEKLİK (Width-Height)
- HTML DİV ve SPAN NEDİR?
- HTML ARKAPLANA MÜZİK EKLEME
- KALİTE KAYBETMEDEN RESİMLERİ BÜYÜTME