Hello sobat icloudZer kali ini admin bakalan memberikan informasi mengenai bagaimana caranya membuat tools warna HTML di blogger ataupun membuat tools color picker di blogger dalam penyebutan yang lainnya
Info: Oke sobat icloudZer jika kamu penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Tools Color
Apa itu tools color? tools color merupakan menu pilihan warna pada HTML yang di kemas dalam tampilan yang sedikit berbeda tapi keren, dan biasanya tools color di blogger sangat di butuhkan bagi mereka yang suka dengan desain web, karena desain web sangat Selalu berhubungan dengan warna HTML itulah mengapa tools warna html diblogger sangat di butuhkan sekali untuk di gunakan
Cara Kerja
Cara kerja dari tools warna HTML online di blogger tersebut sangat sederhana, klik tombol wrana kemudian pilih warna yang di inginkan kemudian klik lagi tombol dapatkan kode untuk membuat kode warna htmlnya muncul, setelah itu copy atauoun salin kode warna HTML tersebut untuk langsung menggunakan
Tampilan keren
Tampilan tools menu color sangat keren, pengguna bisa sesuka hati memilih warna HTML yang ingin digunakan, cuma klik klik aja, lagi pula dalam proses pembuatan nya sangat gampang tinggal copy aja kemudian langsung publikasikan di halaman statis blog
Contoh Tampilan
Jika kamu penasaran dengan contoh tampilan dari alat menu warna HTML di blogger, periksa menggunakan tombol di bawah ini
Info: Bagaimana sobat dnegan contoh tampilan nya keren pasti, ya pastilah haha 🤪
Source kode
Baiklah sobat icloudZer sekarang saatnya admin bakalan menjabarkan mengenai bagaimana caranya memasang tools ataupun alat warna HTML online gratis di blogger, ikuti setiap lamgkah langkah yang admin jabarkan dibawah ini
- Pergi ke halaman menu Page di blogger
- Buat postingan halaman baru
- Setelah berada di dalam editor postingan halaman salin source kode dibawah ini, kemudian tempelkan
<style>
#rahT-c{width:100%;background:#0ab3da;height:200px;display:flex;justify-content:center;align-items:center;flex-direction:column;border-radius:5px;padding:10px}.rahT-in{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.green #rahT-c{background:#008c5f}.orange #rahT-c{background:#ff9e0f}.purple #rahT-c{background:#8500e0}.pink #rahT-c{background:#fe3285}.rahT-in input[type="color"]{height:55px;margin-right:15px;border-radius:5px}.rahT-in input[type="text"]{width:250px;padding:10px;font-size:20px;outline:none;letter-spacing:3px;font-weight:bold;opacity:0.85;transition:all 250ms ease;border-radius:5px}.rahT-in input[type="text"]:hover{opacity:1}button{padding:10px 15px;outline:0;border:0;border-radius:5px;margin:10px}.btn69{display:flex}.dark-mode #rahT-c{background:#242526}.dark-mode #copy,.dark-mode #getHEX{color:#fff;background-color:rgba(255,255,255,.25)}
</style>
<div id="rahT-c">
<div class="rahT-in">
<input id="inputColor" type="color" value="#f80000"/>
<input id="inputText" placeholder="Color" spellcheck="false" type="text" value="#535353"/>
</div>
<div class="btn69">
<button id="getHEX" onclick="color()">
Dapatkan Kode
</button>
<button id="copy" onclick="copy()">
Salin Kode
</button>
</div>
</div>
<center class='rahlink'/>
<script>
var _0xe6bf=["\x76\x61\x6C\x75\x65","\x69\x6E\x70\x75\x74\x43\x6F\x6C\x6F\x72","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x69\x6E\x70\x75\x74\x54\x65\x78\x74","\x73\x65\x6C\x65\x63\x74","\x63\x6F\x70\x79","\x65\x78\x65\x63\x43\x6F\x6D\x6D\x61\x6E\x64","\x43\x72\x65\x61\x74\x65\x64\x20\x77\x69\x74\x68\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x73\x3A\x2F\x2F\x69\x63\x6C\x6F\x75\x64\x69\x63\x65\x2E\x63\x6F\x6D\x22\x3E\x49\x43\x6C\x6F\x75\x64\x69\x63\x65\x2E\x63\x6F\x6D\x3C\x2F\x61\x3E","\x68\x74\x6D\x6C","\x73\x74\x79\x6C\x65","\x7A\x2D\x69\x6E\x64\x65\x78\x3A\x35\x3B\x66\x6F\x6E\x74\x2D\x73\x69\x7A\x65\x3A\x31\x32\x70\x78\x3B\x63\x6F\x6C\x6F\x72\x3A\x20\x23\x31\x36\x31\x36\x31\x37","\x61\x74\x74\x72","\x2E\x72\x61\x68\x6C\x69\x6E\x6B","\x6C\x65\x6E\x67\x74\x68","\x2E\x72\x61\x68\x6C\x69\x6E\x6B\x3A\x76\x69\x73\x69\x62\x6C\x65","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x68\x74\x74\x70\x73\x3A\x2F\x2F\x69\x63\x6C\x6F\x75\x64\x69\x63\x65\x2E\x63\x6F\x6D","\x72\x65\x61\x64\x79"];function color(){var _0x9646x2=document[_0xe6bf[2]](_0xe6bf[1])[_0xe6bf[0]];document[_0xe6bf[2]](_0xe6bf[3])[_0xe6bf[0]]= _0x9646x2}function copy(){document[_0xe6bf[2]](_0xe6bf[3])[_0xe6bf[4]](),document[_0xe6bf[6]](_0xe6bf[5])}$(document)[_0xe6bf[18]](function(){$(_0xe6bf[12])[_0xe6bf[11]](_0xe6bf[9],_0xe6bf[10])[_0xe6bf[8]](_0xe6bf[7]);setInterval(function(){if(!$(_0xe6bf[14])[_0xe6bf[13]]){window[_0xe6bf[16]][_0xe6bf[15]]= _0xe6bf[17]}},3000)})
</script>Info: Jika sudah segera publikasikan dan ligat bagaimana hasilnya