Senin, 29 April 2013

Cara Membuat Tombol Share Sosial Media Melayang Dengan HTML

Hidup itu perlu perubahan sob, salah satu caranya yaitu kita harus bisa mengikuti zaman. Saat ini zamannya teknologi, jadi kita juga harus tahu hal-hal apa yang terbaru. Karena kalau kita tidak bisa mengikuti maka kita akan ketinggalan zaman. Minimalnya kita tahu dulu internet, karena dengan berinternet kita bisa mencari informasi atau berita yang bukan hanya dari dalam negeri tapi juga bersifat global tentunya. Apalagi sekarang banyaknya sosial media yang memudahkan kita untuk berkomunikasi di dunia maya dengan orang lain.

Tombol Share melayang

Daripada bicaranya lebih mendalam, langsung saja pada pembahasannya yaitu tentang membuat tombol share sosial media melayang yang ada di blog saya ini. Berikut cara-caranya:

1. Masuk Dasboard blogger > Pilih Blog > Tata Letak > Tambah Gadget > HTML/Javascript

2. Copy-Paste kode di bawah ini:
<!�bangiz-tombol sosial media melayang�>
<style>
#pageshare {position:fixed; bottom:15%; right:30px; float:right; border: 0px solid black; border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#eff3fa;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:3px 3px 0 3px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Share This With Your Friends">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://downloadwallpaperanimasi.blogspot.com//search/label/Animasi" target="blank"><font color="black">[Get Other]<font></font></font></a></div></div>
<!� bangiz-tombol sosial media melayang �></!�></!�bangiz-tombol>

3. Kalau sudah jangan lupa simpan, lalu lihat hasilnya

Kalau Anda menggunakan dasar template yang gelap lebih baik gunakan kode yang di bawah ini:
<!� bangiz-tombol sosial media melayang �>
<style>
#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#000000;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Share This With Your Friends">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="
http://downloadwallpaperanimasi.blogspot.com//search/label/Animasi" target="blank"><font color="black">[Get Other]<font></font></font></a></div></div>
<!� bangiz-tombol sosial media melayang �>

Begitulah cara membuat tombol sosial media melayang dengan menggunakan kode HTML versi bangiz. Jika ada yang mau ditanyakan, silahkan berkomentar. Happy blogging.

Cara Membuat Label Cloud Keren

Halo semua,, blog Bangiz kali ini akan berbagi blogging.  Seperti yang tampak pada judul dan gambarnya, kalau Anda suka ngeblog atau membuat website pasti sudah bisa menebak. Tutorialnya yaitu cara membuat label cloud. Meskipun di internet sudah banyak yang membahas dengan hasil tampilan yang berbeda-beda, tapi tidak apa-apa siapa tahu Anda tertarik dengan tabel cloud yang akan saya bahas. Untuk screenshotnya lihat gambar berikut:

Label Cloud Keren

Oke langsung saja beri tahu cara pembuatannya.

1. Masuk ke dashboard blogger

2. Klik Template > Edit HTML 

3. Klik Ctrl + F, cari kode ]]></b:skin>


4. Copy kode CSS di bawah sebelum/diatas ]]></b:skin>

.label-size {
float: left;
margin: 0 0 7px 20px;
position: relative;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 0.75em;
font-weight: bold;
text-decoration: none;
color: #996633;
text-shadow: 0px 1px 0px rgba(255,255,255,.4);
padding: 0.417em 0.417em 0.417em 0.917em;
border-top: 1px solid #d99d38;
border-right: 1px solid #d99d38;
border-bottom: 1px solid #d99d38;
-webkit-border-radius: 0 0.25em 0.25em 0;
-moz-border-radius: 0 0.25em 0.25em 0;
border-radius: 0 0.25em 0.25em 0;
background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');
-webkit-box-shadow: inset 0 1px 0 #faeaba,
0 1px 1px rgba(0,0,0,.1);
-moz-box-shadow: inset 0 1px 0 #faeaba,
0 1px 1px rgba(0,0,0,.1);
box-shadow: inset 0 1px 0 #faeaba,
0 1px 1px rgba(0,0,0,.1);
z-index: 1;
}
.label-size:before {
content: '';
width: 1.30em;
height: 1.39em;
background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');
position: absolute;
left: -0.69em;
top: .2em;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
border-left: 1px solid #d99d38;
border-bottom: 1px solid #d99d38;
-webkit-border-radius: 0 0 0 0.25em;
-moz-border-radius: 0 0 0 0.25em;
border-radius: 0 0 0 0.25em;
z-index: 1;
}
.label-size:after {
content: '';
width: 0.5em;
height: 0.5em;
background: #fff;
-webkit-border-radius: 4.167em;
-moz-border-radius: 4.167em;
border-radius: 4.167em;
border: 1px solid #d99d38;
-webkit-box-shadow: 0 1px 0 #faeaba;
-moz-box-shadow: 0 1px 0 #faeaba;
box-shadow: 0 1px 0 #faeaba;
position: absolute;
top: 0.667em;
left: -0.083em;
z-index: 9999;
}
#Label1 {
height: 210px;
}
.label-size:hover {
background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');
border-color: #e1b160;
}
.label-size:hover:before {
background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');
border-color: #e1b160;
}

5. Simpan Template dan lihat hasilnya

Catatan:
  • Pastikan Anda telah menambahkan gadget label di blog.
  • Pilih tampilkan sebagai cloud (lihat gambar). Pengaturan lainnya bebas.
label keren

Selamat mencoba!!!!

Selasa, 23 April 2013

Cara Membuat Open New Tab Semua Link di Blog

Setelah lumayan lama saya tidak posting tentang blogging, kali ini saya akan berbagi tips khususnya untuk Anda yang suka ngeblog atau membuat website. Posting blogging saya sebelumnya yaitu Cara Memasang Widget Alexa Terbaru di Blog dan Cara Membuat Thread Comment Reply di Blog. Untuk sekarang sesuai dengan judul di atas Cara Membuat Open New Tab Semua Link di Blog. Bahasanya campur inggris sedikit, tapi tidak apa-apa kan?! yang penting mengerti maksudnya.

mata berkedip gif

Oke saja perjelas lagi. Jadi kalau kita klik kata, kalimat atau apa saja yang mempunyai link, baik di dalam blog kita sendiri atau link yang lainnya maka otomatis akan terbuka di tab yang baru tanpa perlu melakukannya secara manual dengan cara klik kanan. Langsung ikuti saja caranya di bawah ini kalau tertarik untuk menerapkannya di blog Anda.

1. Masuk ke Dashboard Blogger > pilih Blog Anda

2. Pilih Template > Edit HTML 

3. Cari kode </head> atau <head> (Untuk memudahkan gunakan Ctrl+F)

4. Silahkan copy kode di bawah ini

   <base target='_blank' />

5. Lalu Paste tepat di atas kode </head>

6. Simpan Template

7. Lihat hasilnya

Demikian trik blogging kali ini tentang cara membuat open new tab semua link di blog. Silahkan follow Bangiz melalui sosial media untuk mendapatkan update terbaru. Happy blogging!!!














Senin, 22 April 2013

Kode Warna CSS Lengkap

CSS
Berikut ini saya berikan kode warna CSS. CSS (Cascading Style Sheets) merupakan bahasa untuk menjelaskan presentasi dari halaman Web. Dalam Ini termasuk warna, tata letak dan font informasi, serta bagaimana mengubah presentasi pada berbagai jenis perangkat. CSS adalah independen dari HTML dan dapat digunakan dengan berbasis XML markup language. Pemisahan HTML dari CSS membuatnya lebih mudah untuk menjaga kode berbagi style sheet di halaman. Silahkan dipilih sesuai keinginan dan kebutuhan Anda.

Warna Warna HEX Warna RGB
#000000 rgb(0,0,0)
#FF0000 rgb(255,0,0)
#00FF00 rgb(0,255,0)
#0000FF rgb(0,0,255)
#FFFF00 rgb(255,255,0)
#00FFFF rgb(0,255,255)
#FF00FF rgb(255,0,255)
#C0C0C0 rgb(192,192,192)
#FFFFFF rgb(255,255,255)

Red LightHEXRGB
#000000 rgb(0,0,0) 
#080000 rgb(8,0,0) 
#100000 rgb(16,0,0) 
#180000 rgb(24,0,0) 
#200000 rgb(32,0,0) 
#280000 rgb(40,0,0) 
#300000 rgb(48,0,0) 
#380000 rgb(56,0,0) 
#400000 rgb(64,0,0) 
#480000 rgb(72,0,0) 
#500000 rgb(80,0,0) 
#580000 rgb(88,0,0) 
#600000 rgb(96,0,0) 
#680000 rgb(104,0,0) 
#700000 rgb(112,0,0) 
#780000 rgb(120,0,0) 
#800000 rgb(128,0,0) 
#880000 rgb(136,0,0) 
#900000 rgb(144,0,0) 
#980000 rgb(152,0,0) 
#A00000 rgb(160,0,0) 
#A80000 rgb(168,0,0) 
#B00000 rgb(176,0,0) 
#B80000 rgb(184,0,0) 
#C00000 rgb(192,0,0) 
#C80000 rgb(200,0,0) 
#D00000 rgb(208,0,0) 
#D80000 rgb(216,0,0) 
#E00000 rgb(224,0,0) 
#E80000 rgb(232,0,0) 
#F00000 rgb(240,0,0) 
#F80000 rgb(248,0,0) 
#FF0000 rgb(255,0,0) 


Gray ShadesHEXRGB
#000000 rgb(0,0,0) 
#080808 rgb(8,8,8) 
#101010 rgb(16,16,16) 
#181818 rgb(24,24,24) 
#202020 rgb(32,32,32) 
#282828 rgb(40,40,40) 
#303030 rgb(48,48,48) 
#383838 rgb(56,56,56) 
#404040 rgb(64,64,64) 
#484848 rgb(72,72,72) 
#505050 rgb(80,80,80) 
#585858 rgb(88,88,88) 
#606060 rgb(96,96,96) 
#686868 rgb(104,104,104) 
#707070 rgb(112,112,112) 
#787878 rgb(120,120,120) 
#808080 rgb(128,128,128) 
#888888 rgb(136,136,136) 
#909090 rgb(144,144,144) 
#989898 rgb(152,152,152) 
#A0A0A0 rgb(160,160,160) 
#A8A8A8 rgb(168,168,168) 
#B0B0B0 rgb(176,176,176) 
#B8B8B8 rgb(184,184,184) 
#C0C0C0 rgb(192,192,192) 
#C8C8C8 rgb(200,200,200) 
#D0D0D0 rgb(208,208,208) 
#D8D8D8 rgb(216,216,216) 
#E0E0E0 rgb(224,224,224) 
#E8E8E8 rgb(232,232,232) 
#F0F0F0 rgb(240,240,240) 
#F8F8F8 rgb(248,248,248) 
#FFFFFF rgb(255,255,255) 



#FFFFFF #FFFFCC #FFFF99 #FFFF66 #FFFF33 #FFFF00
#FFCCFF #FFCCCC #FFCC99 #FFCC66 #FFCC33 #FFCC00
#FF99FF #FF99CC #FF9999 #FF9966 #FF9933 #FF9900
#FF66FF #FF66CC #FF6699 #FF6666 #FF6633 #FF6600
#FF33FF #FF33CC #FF3399 #FF3366 #FF3333 #FF3300
#FF00FF #FF00CC #FF0099 #FF0066 #FF0033 #FF0000
#CCFFFF #CCFFCC #CCFF99 #CCFF66 #CCFF33 #CCFF00
#CCCCFF #CCCCCC #CCCC99 #CCCC66 #CCCC33 #CCCC00
#CC99FF #CC99CC #CC9999 #CC9966 #CC9933 #CC9900
#CC66FF #CC66CC #CC6699 #CC6666 #CC6633 #CC6600
#CC33FF #CC33CC #CC3399 #CC3366 #CC3333 #CC3300
#CC00FF #CC00CC #CC0099 #CC0066 #CC0033 #CC0000
#99FFFF #99FFCC #99FF99 #99FF66 #99FF33 #99FF00
#99CCFF #99CCCC #99CC99 #99CC66 #99CC33 #99CC00
#9999FF #9999CC #999999 #999966 #999933 #999900
#9966FF #9966CC #996699 #996666 #996633 #996600
#9933FF #9933CC #993399 #993366 #993333 #993300
#9900FF #9900CC #990099 #990066 #990033 #990000
#66FFFF #66FFCC #66FF99 #66FF66 #66FF33 #66FF00
#66CCFF #66CCCC #66CC99 #66CC66 #66CC33 #66CC00
#6699FF #6699CC #669999 #669966 #669933 #669900
#6666FF #6666CC #666699 #666666 #666633 #666600
#6633FF #6633CC #663399 #663366 #663333 #663300
#6600FF #6600CC #660099 #660066 #660033 #660000
#33FFFF #33FFCC #33FF99 #33FF66 #33FF33 #33FF00
#33CCFF #33CCCC #33CC99 #33CC66 #33CC33 #33CC00
#3399FF #3399CC #339999 #339966 #339933 #339900
#3366FF #3366CC #336699 #336666 #336633 #336600
#3333FF #3333CC #333399 #333366 #333333 #333300
#3300FF #3300CC #330099 #330066 #330033 #330000
#00FFFF #00FFCC #00FF99 #00FF66 #00FF33 #00FF00
#00CCFF #00CCCC #00CC99 #00CC66 #00CC33 #00CC00
#0099FF #0099CC #009999 #009966 #009933 #009900
#0066FF #0066CC #006699 #006666 #006633 #006600
#0033FF #0033CC #003399 #003366 #003333 #003300
#0000FF #0000CC #000099 #000066 #000033 #000000

Kode Warna HTML Lengkap

HTML

Berikut ini saya share tentang kode warna HTML (HyperText Marup Language ). HTML ini biasanya digunakan untuk membuat halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web di internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi.
 

Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Kode HTML ini juga digunakan untuk mengubah tampilan blog, baik itu background, huruf, angka dan sebagainya.  Langsung cek saja di bawah:


KODE WARNA HTML
Contoh:Putih =>#ffffff;
#FOF8FF
Aliceblue
#FAEBD7
Antiquewhite
#00FFFF
Aqua
#7FFFD4
Aquamarine
#F0FFFF
Azure
#F5F5DC
Beige
#FFE4C4
Bisque
#000000
Black
#FFEBCD
Blanchedalmond
#0000FF
Blue
#8A2BE2
Blueviolet
#A52A2A
Brown
#DEB887
Burlywood
#5F9EAD
Cadetblue
#7FFF00
Chartreuse
#D2691E
Chocolate
#FF7F50
Coral
#64950
Cornflowerblue
#FFF8DC
Cornsilk
#DC143C
Crimson
#00FFFF
Cyan
#00008B
Darkblue
#008B8B
Darkcyan
#B8860B
Darkgoldenrod
#A9A9A9
Darkgray
#006400
Darkgreen
#8B008B
Darkmagenta
#BDB76B
Darkkhaki
#556B2F
Darkolivegreen
#FF8C00
Darkorange
#9932CC
Darkorchid
#8B0000
Darkred
#E9967A
Darksalmon
#8FBC8B
Darkseagreen
#483D8B
Darkslateblue
#2F4F4F
Darkslategray
#00CED1
Darkturquoise
#9400D3
Darkviolet
#FF1493
Deeppink
#00BFFF
Deepskyblue
#696969
Dimgray
#1E90FF
Dodgerblue
#B22222
Firebrick
#FFFAF0
Floralwhite
#228B22
Forestgreen
#FF00FF
Fuchsia
#DCDCDC
Gainsboro
#F8F8FF
Ghostwhite
#FFD700
Gold
#DAA520
Goldenrod
#808080
Gray
#008000
Green
#ADFF2F
Greenyellow
#F0FFF0
Honeydew
#FF69B4
Hotpink
#CD5C5C
Indianred
#4B0082
Indigo
#FFFFF0
Ivory
#F0E68C
Khaki
#E6E6FA
Lavender
#FFF0F5
Lavenderblush
#7CFC00
Lawngreen
#FFFACD
Lemonchiffon
#ADE8E6
Lightblue
#F08080
Lightcoral
#E0FFFF
Lightcyan
#FAFAD2
Lightgoldenrodyellow
#90EE90
Lightgreen
#D3D3D3
Lightgray
#FFB6C1
Lightpink
#FFA072
Lightsalmon
#20B2AA
Lightseagreen
#87CEFA
Lightskyblue
#778899
Lightslategray
#B0C4DE
Lightsteelblue
#FFFFE0
Lightyellow
#00FF00
Lime
#32CD32
Limegreen
#FAF0E6
Linen
#FF00FF
Magenta
#800000
Maroon
#66CDAA
Mediumaquamarine
#0000CD
Mediumblue
#BA55D3
Mediumorchid
#9370DB
Mediumpurple
#3CB371
Mediumseagreen
#7B68EE
Mediumslateblue
#00FA9A
Mediumspringgreen
#48D1CC
Mediumturquoise
#C71585
Mediumvioletred
#191970
Midnightblue
#F5FFFA
Mintcream
#FFE4E1
Mistyrose
#FFE4E1
Moccasin
#FFDEAD
Navajowhite
#000080
Navy
#FDF5E6
Oldlace
#808000
Olive
#6B8E23
Olivedrab
#FFA500
Orange
#FF100%0
Orangered
#DA70D6
Orchid
#EEE8AA
Palegoldenrod
#98FB98
Palgreen
#AFEEEE
Paleturquoise
#DB7093
Palevioletred
#FFEFD5
Papayawhip
#FFDAB9
Peachpuff
#CD853F
Peru
#FFC0CB
Pink
#DDA0DD
Plum
#B0E0E6
Powderblue
#800080
Purple
#FF0000
Red
#BC8F8F
Rosybrown
#4169E1
Royalblue
#8B4513
Saddlebrown
#FA8072
Salmon
#F4A460
Sandybrown
#2E8B57
Seagreen
#FFF5EE
Seashell
#A0522D
Sienna
#C0C0C0
Silver
#87CEEB
Skyblue
#708090
Slategray
#FFFAFA
Snow
#00FF7F
Springgreen
#4682B4
Steelblue
#D2B48C
Tan
#008080
Teal
#D8BFD8
Thistle
#FF6347
Tomato
#40E0D0
Turquoise
#EE82EE
Violet
#F5DEB3
Wheat
#FFFFFF
White
#F5F5F5
Whitesmoke
#FFFF00
Yellow
#9ACD32
Yellowgreen