{"id":1462,"date":"2023-02-17T03:37:50","date_gmt":"2023-02-17T03:37:50","guid":{"rendered":"https:\/\/www.tools.keywordfinder.us\/?page_id=1462"},"modified":"2023-02-17T03:37:50","modified_gmt":"2023-02-17T03:37:50","slug":"binary-hex-decimal-converter","status":"publish","type":"page","link":"https:\/\/tools.billionsideas.com\/pt\/binary-hex-decimal-converter\/","title":{"rendered":"Binary\/HEX\/Decimal Converter"},"content":{"rendered":"<div style=\"height:70px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column has-luminous-vivid-amber-background-color has-background is-layout-flow wp-block-column-is-layout-flow\">\n<h1>Binay\/HEX\/Decimal Converter<\/h1><section><br>\n      <h4 id=\"heading\">Converted text display here!<\/h4>\n<br>\n<input placeholder=\"Decimal to Binary\" type=\"text\" id=\"db\"><button id=\"dbbtn\"><b>Convert<\/b><\/button>\n<br>\n<input placeholder=\"Binary to Decimal\" id=\"bd\" type=\"text\"><button id=\"btd\"><b>Convert<\/b><\/button>\n<br><br>\n\n<input placeholder=\"Decimal to Hex\" type=\"text\" id=\"dh\"><button id=\"dth\"><b>Convert<\/b><\/button>\n<br>\n<input placeholder=\"Hex to Decimal\" type=\"text\" id=\"hd\"><button id=\"htd\"><b>Convert<\/b><\/button>\n<br><br>\n\n<input placeholder=\"Binary to Hex\" type=\"text\" id=\"bh\"><button id=\"bth\"><b>Convert<\/b><\/button>\n<br>\n\n<input placeholder=\"Hex to Binary\" type=\"text\" id=\"hb\"><button id=\"htb\"><b>Convert<\/b><\/button>\n<br><br>\n<\/section>\n<script>\ndocument.getElementById(\"dbbtn\").addEventListener(\"click\",dtb)\ndocument.getElementById(\"btd\").addEventListener(\"click\",btd)\ndocument.getElementById(\"htd\").addEventListener(\"click\",htd)\ndocument.getElementById(\"dth\").addEventListener(\"click\",dth)\ndocument.getElementById(\"bth\").addEventListener(\"click\",bth)\ndocument.getElementById(\"htb\").addEventListener(\"click\",htb)\n\nfunction dtb(){\n  \n var value = document.getElementById(\"db\").value \n var total = value\n var answer = \"\";\n  \n  while(total>0){\n    \n    answer = (total % 2) + answer\n    total = Math.floor(total\/2)\n    \n  }\n  \n  document.getElementById(\"heading\").innerHTML = value + \" in Decimal is \" + answer + \" in binary.\"\n  \n}\n\nfunction btd(){\n  \n  var value = document.getElementById(\"bd\").value\n  var valueArr = value.split(\"\")\n  var answer = 0\n  var n = 0\n  \n  valueArr.reverse()\n  \n  for(i=0;i<valueArr.length;i++){\n    \n    \n    answer = answer + valueArr[i]*(Math.pow(2,n))\n    \n    n = n+1\n    \n  }\n  \n  document.getElementById(\"heading\").innerHTML = value + \" in binary is \" + answer + \" in decimal.\"\n  \n}\n\nfunction htd(){\n  \n  var value = document.getElementById(\"hd\").value\n  var valueArr = value.split(\"\")\n  var decArr = []\n  var answer = 0\n  var n = 0\n  \n  valueArr.reverse()\n  \n  for(i=0;i<valueArr.length;i++){\n    \n    switch(valueArr[i]){\n        \n      case \"1\":\n        \n        decArr[i] = 1\n        \n        break\n        \n      case \"2\":\n        decArr[i] = 2\n        \n        break\n        \n      case \"3\":\n        decArr[i] = 3\n        break\n      case \"4\":\n        decArr[i] = 4\n        break\n      case \"5\": \n        decArr[i] = 5\n        break\n      case \"6\":\n        decArr[i] = 6\n        break\n      case \"7\":\n        decArr[i] =7\n        break\n      case \"8\":\n        decArr[i] = 8\n        break\n      case \"9\":\n        decArr[i] = 9\n        break\n      case \"A\":\n        decArr[i] = 10\n        break\n      case \"B\":\n        decArr[i] = 11\n        break\n      case \"C\":\n        decArr[i] = 12\n        break\n      case \"D\":\n        decArr[i] = 13\n        break\n      case \"E\":\n        decArr[i] = 14\n        break\n      case \"F\":\n        decArr[i] = 15\n        break\n        \n    }\n    \n  \n  \n    \n  }\n    for(i=0;i<decArr.length;i++){\n        answer = answer + decArr[i]*(Math.pow(16,n))\n      n = n +1\n    }\n  document.getElementById(\"heading\").innerHTML = value + \" in hexadecimal is \" + answer + \" in decimal.\"\n}\n\nfunction dth(){\n  \n var value = document.getElementById(\"dh\").value \n var total = value\n var answer = \"\"\n var halfway = 0\n var n = 0\n  \n  while(total>0){\n    \n    answer = (total % 2) + answer\n    total = Math.floor(total\/2)\n    \n  }\n  \n  var answerArr = answer.split(\"\").reverse()\n  var splitArr = []\n  \n  answerArr.unshift(0)\n  \n  \n  \n  for(i=1;i<answerArr.length;i=i+1){\n    \n    halfway = halfway + answerArr[i]*(Math.pow(2,n))\n    \n    n = n+1\n    \n    if(i%4==0 || i==answerArr.length-1){\n    splitArr.push(halfway)\n    halfway = 0\n    n=0\n    }\n  }\n  \n  for(j=0;j<splitArr.length;j++){\n    \n    if(splitArr[j] == 10){\n      \n      splitArr[j] = \"A\"\n      \n    }else if(splitArr[j] == 11){\n      splitArr[j] = \"B\"\n    }else if(splitArr[j] == 12){\n      splitArr[j] = \"C\"\n    }else if(splitArr[j] == 13){\n      splitArr[j] = \"D\"\n    }else if(splitArr[j] == 14){\n      splitArr[j] = \"E\"\n    }else if(splitArr[j] == 15){\n      splitArr[j] = \"F\"\n    }\n    \n  }\n  \n  \n  var outputArr = splitArr.reverse().join(\"\")\n  \n  document.getElementById(\"heading\").innerHTML = value + \" in decimal is \" + outputArr + \" in hexadecimal.\"\n  \n}\n\nfunction bth(){\n  \n   var value = document.getElementById(\"bh\").value \n var answer = value\n var halfway = 0\n var n = 0\n  \n    \n  var answerArr = answer.split(\"\").reverse()\n  var splitArr = []\n  \n  answerArr.unshift(0)\n  \n  \n  \n  for(i=1;i<answerArr.length;i=i+1){\n    \n    halfway = halfway + answerArr[i]*(Math.pow(2,n))\n    \n    n = n+1\n    \n    if(i%4==0 || i==answerArr.length-1){\n    splitArr.push(halfway)\n    halfway = 0\n    n=0\n    }\n  }\n  \n  for(j=0;j<splitArr.length;j++){\n    \n    if(splitArr[j] == 10){\n      \n      splitArr[j] = \"A\"\n      \n    }else if(splitArr[j] == 11){\n      splitArr[j] = \"B\"\n    }else if(splitArr[j] == 12){\n      splitArr[j] = \"C\"\n    }else if(splitArr[j] == 13){\n      splitArr[j] = \"D\"\n    }else if(splitArr[j] == 14){\n      splitArr[j] = \"E\"\n    }else if(splitArr[j] == 15){\n      splitArr[j] = \"F\"\n    }\n    \n  }\n  \n  \n  var outputArr = splitArr.reverse().join(\"\")\n  \n  document.getElementById(\"heading\").innerHTML = value + \" in binary is \" + outputArr + \" in hexadecimal.\"\n  \n}\n\nfunction htb(){\n  \n  \n  var value = document.getElementById(\"hb\").value\n  var valueArr = value.split(\"\")\n  var decArr = []\n  var answer = 0\n  var n = 0\n  \n  valueArr.reverse()\n  \n  for(i=0;i<valueArr.length;i++){\n    \n    switch(valueArr[i]){\n        \n      case \"1\":\n        decArr[i] = 1   \n        break\n      case \"2\":\n        decArr[i] = 2\n        break\n      case \"3\":\n        decArr[i] = 3\n        break\n      case \"4\":\n        decArr[i] = 4\n        break\n      case \"5\": \n        decArr[i] = 5\n        break\n      case \"6\":\n        decArr[i] = 6\n        break\n      case \"7\":\n        decArr[i] =7\n        break\n      case \"8\":\n        decArr[i] = 8\n        break\n      case \"9\":\n        decArr[i] = 9\n        break\n      case \"A\":\n        decArr[i] = 10\n        break\n      case \"B\":\n        decArr[i] = 11\n        break\n      case \"C\":\n        decArr[i] = 12\n        break\n      case \"D\":\n        decArr[i] = 13\n        break\n      case \"E\":\n        decArr[i] = 14\n        break\n      case \"F\":\n        decArr[i] = 15\n        break\n        \n    }\n    \n  }\n    for(i=0;i<decArr.length;i++){\n        answer = answer + decArr[i]*(Math.pow(16,n))\n      n = n +1\n    }\n\n  var total = answer\n  answer = \"\"\n  \n  while(total>0){\n    \n    answer = (total % 2) + answer\n    total = Math.floor(total\/2)\n    \n  }\n  \n  document.getElementById(\"heading\").innerHTML = value + \" in hexadecimal is \" + answer + \" in binary.\"\n  \n}\n<\/script>\n\n\n<style>\nsection {\n      \n      \n      align-items: center;\n      background: #f2f2f2;\n      padding: 0px;\n      border-radius: 0px;margin-bottom:3px;\n    }\n\nh1 {\n  margin-top: 5px;color:#fff;font-family: 'Space Grotesk', sans-serif;font-size:40px;font-weight:500;\n}\n\nbody {\n  text-align: center;\n  \n}\ninput[type=\"text\"] {\n  width: 50%;margin:0 auto;\n  height: 40px;\n  padding: 5px;\n  font-size: 16px;\n  font-family: Arial, sans-serif;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;\n  border-radius: 5px;\n  box-shadow: 2px 2px 5px #ccc;\n  transition: all 0.2s ease-in-out;\n  margin-top:10px;margin-bottom:10px;\n}\ncanvas {\n  border: 10px solid;\n  border-image: linear-gradient(to bottom, #007bff, #00f260);\n  border-image-slice: 1;\n  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);\n  margin-top:10px;margin-bottom:10px;\n  width:50%;\n}\n\ninput[type=\"url\"] {\n  width: 80%;\n  height: 40px;\n  padding: 5px;\n  font-size: 16px;\n  font-family: Arial, sans-serif;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;\n  border-radius: 5px;\n  box-shadow: 2px 2px 5px #ccc;\n  transition: all 0.2s ease-in-out;\n  margin-top:10px;margin-bottom:10px;\n}\ninput[type=\"number\"] {\n  width: 20%;\n  height: 40px;\n  padding: 5px;\n  font-size: 16px;\n  font-family: Arial, sans-serif;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;\n  border-radius: 5px;\n  box-shadow: 2px 2px 5px #ccc;\n  transition: all 0.2s ease-in-out;\n  margin-top:10px;margin-bottom:10px;\n}\nselect {\n  width: 20%;\n  height: 40px;\n  padding: 5px;\n  font-size: 16px;\n  font-family: Arial, sans-serif;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;\n  border-radius: 5px;\n  box-shadow: 2px 2px 5px #ccc;\n  transition: all 0.2s ease-in-out;\n  margin-top:10px;margin-bottom:10px;\n}\n\n\ntextarea {\n  width: 80%;\n  height: 200px;\n  padding: 10px;\n  font-size: 16px;\n  font-family: Arial, sans-serif;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;\n  border-radius: 5px;\n  box-shadow: 2px 2px 5px #ccc, -2px -2px 5px #ccc;  \n  transition: all 0.2s ease-in-out;\n  margin-top:10px;margin-bottom:10px;\n}\n\ntextarea:hover {\n  border-color: #06c;\n  box-shadow: 2px 2px 10px #06c;\n}\n\ntextarea:focus {\n  outline: none;\n  border-color: #06c;\n  box-shadow: 2px 2px 10px #06c;\n}\n#image-container {\n  width: 50%;\n  height: auto;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  border: 3px solid;\n  border-image: linear-gradient(to right, #f60, #f9c);\n  margin-top:10px;margin-bottom:10px;\n  border-image-slice: 1;\n  padding:15px;margin:0 auto;\n}\n\n#image-container img {\n  max-width: 100%;\n  }\n\n#convertedImage {\n  width: 50%;\n  height: auto;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  border: 5px solid;\n  border-image: linear-gradient(to right, #f60, #f9c);\n  margin-top:10px;margin-bottom:10px;\n  border-image-slice: 1;padding:11px;\n}\n.img {\n  width: 50%;\n  height: auto;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  border: 5px solid;\n  border-image: linear-gradient(to right, #f60, #f9c);\n  margin-top:10px;margin-bottom:10px;\n  border-image-slice: 1;padding:11px;\n}\n.image {\n  width: 50%;\n  height: auto;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  border: 5px solid;\n  border-image: linear-gradient(to right, #f60, #f9c);\n  margin-top:10px;margin-bottom:10px;\n  border-image-slice: 1;padding:11px;\n}\n#image {\n  width: 50%;\n  height: auto;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  border: 5px solid;\n  border-image: linear-gradient(to right, #f60, #f9c);\n  margin-top:10px;margin-bottom:10px;\n  border-image-slice: 1;padding:11px;\n}\n#file-input {\n  display: none;\n}\n\ninput[type=file]::file-selector-button {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #008B8B 54%, #55555e 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#008B8B 54%,#55555e 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,##008B8B 54%,#55555e 100%);\n}\n\n\ninput[type=file]::file-selector-button {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 6px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #ffff00;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border: 5px solid;\n    border-image: linear-gradient(to right, #ff7f00, ,#0033cc, #55555e, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n    margin-top:20px;width:100%;margin-bottom:20px;\n}\n\n\n\n\n\ninput[type=file]::file-selector-button:hover\n {\n  background: #0033cc;border-radius:100px;border:0px solid #55555e;padding: 7px 50px;\n\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n\n\n@keyframes pulse {\n  0% {\n    background-position: left;\n  }\n  50% {\n    background-position: right;\n  }\n  100% {\n    background-position: left;\n  }\n}\n\ninput[type=file]::file-selector-button:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;border-radius:20%;\n}\n\n#downloadLink {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n#downloadLink {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n    margin-top:15px;margin-bottom:15px;width:300px;\n}\n\n#downloadLink:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n#downloadLink:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n\n#button {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n#button {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n#button:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n#button:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n.button {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n.button {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n.button:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n.button:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n\nbutton {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\nbutton {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 20px;\n    line-height: 40px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 0%;\n    border-radius: 0%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border:0;margin-left:5px;\n    font-size: 18px;\n   \n}\n\nbutton:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\nbutton:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n\n#btn {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n#btn {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n#btn:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n#btn:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n\n.btn {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n.btn {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n.btn:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n.btn:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n\n#button-copy {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n#button-copy {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n#button-copy:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n#button-copy:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\n#copy-button {\n  background: #fc00c7;\n    background: -moz-linear-gradient(-45deg, #fc00c7 0%, #1c4efd 54%, #00aded 100%);\n    background: -webkit-linear-gradient(-45deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n    background: linear-gradient(135deg, #fc00c7 0%,#1c4efd 54%,#00aded 100%);\n}\n\n\n#copy-button {font-size: 16px;\n    font-weight: 500;\n    font-family: 'Poppins', sans-serif;\n    padding: 0px 50px;\n    line-height: 50px;\n    text-align: center;\n    outline: none;\n    cursor: pointer;\n    color: #fff;\n    background-color: #000;\n    -webkit-border-radius: 20%;\n    border-radius: 20%;\n    display: inline-block;\n    position: relative;\n    -webkit-box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    box-shadow: 0 10px 15px 0px rgb(233 30 99 \/ 15%);\n    text-shadow: 2px 2px 4px #333;\n    border-bottom: 2px solid #ff7f00;\n    border-image: linear-gradient(to right, #ff7f00, #ffa600);\n    border-image-slice: 1;\n    font-size: 18px;\n   \n}\n\n#copy-button:hover\n {\n  background: #0033cc;\n    background: -moz-linear-gradient(-45deg, #00aded 0%, #ff7f00 54%, #1c4efd 100%);\n    background: -webkit-linear-gradient(-45deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n    background: linear-gradient(135deg, #00aded 0%,#ff7f00 54%,#1c4efd 100%);\n}\n\n#copy-button:active {\n  animation: pulse 1s ease-out infinite;\n  border-color: #000;background:#000;\n}\n\npre {\n  width: 80%;\n  margin: 0 auto;\n  text-align: left;\n  padding: 1em;\n  background-color: #f5f5f5;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  overflow-x: auto;\n  white-space: pre-wrap;\n  margin-top:10px;margin-bottom:10px;\n\n}\ncode {\n  font-family: Monaco, Consolas, \"Andale Mono\", \"DejaVu Sans Mono\", monospace;\n  font-size: 0.9em;\n  color: #333;\n  background-color: #f9f9f9;\n  padding: 0.2em 0.4em;\n  border-radius: 4px;\n}\n.result {\n  margin: 20px 0;\n  padding: 20px;\n  background-color: #f9f9f9;\n  border-radius: 10px;\n  box-shadow: 1px 1px 5px #999;\n  width:80%;\n  margin:0 auto;\n}\n\ninput[type=\"range\"] {\n  -webkit-appearance: none;\n  width: 80%;\n  background: transparent;\n  height: 10px;\n  border-radius: 5px;\n  outline: none;\n  padding: 0;\n  margin: 0;\n  box-shadow: inset 0 0 5px #333;\n  transition: box-shadow 0.2s;\n  margin-top:10px;\n\n}\n\ninput[type=\"range\"]:focus {\n  box-shadow: inset 0 0 5px #888;\n}\n\ninput[type=\"range\"]::-webkit-slider-thumb {\n  -webkit-appearance: none;\n  height: 20px;\n  width: 20px;\n  border-radius: 50%;\n  background: #4CAF50;\n  cursor: pointer;\n  transition: background 0.2s;\n  margin-top:-5px;\n}\n\ninput[type=\"range\"]::-webkit-slider-thumb:hover {\n  background: #3e8e41;\n}\n\ninput[type=\"range\"]::-webkit-slider-runnable-track {\n  height: 10px;\n  background: #ddd;\n  border-radius: 5px;\n  border: none;\n}\ninput[type=\"checkbox\"] {\n  appearance: none;\n  width: 45px;\n  height: 25px;\n  background: transparent;\n  border: 2px solid;\n  border-image: linear-gradient(to right, #06c, #f90) 1;  border-radius: 5px;\n  margin: 10px;\n  outline: none;\n  cursor: pointer;\n  position: relative;\n}\n\ninput[type=\"checkbox\"]:before {\n  content: \"\";\n  width: 15px;\n  height: 15px;\n  background: #D209A4;\n  border-radius: 100px;\n  position: absolute;\n  left: 2px;\n  \n  top: 3px;\n  transition: all 0.2s;\n}\n\ninput[type=\"checkbox\"]:checked:before {\n  transform: translateX(20px);\n}\n\ninput[type=\"checkbox\"]:focus {\n  border: 2px solid #888;\n}\ninput[type=\"radio\"] {\n  appearance: none;\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  border: 2px solid #333;\n  margin-right: 10px;\n  outline: none;\n  position: relative;\n  cursor: pointer;\n}\n\ninput[type=\"radio\"]:after {\n  content: \"\";\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: #333;\n  position: absolute;\n  top: 5px;\n  left: 5px;\n  opacity: 0;\n  transition: all 0.2s;\n}\n\ninput[type=\"radio\"]:checked:after {\n  opacity: 1;\n}\n\ninput[type=\"radio\"]:focus {\n  border-color: #888;\n}\n\n\ninput[type=\"radio\"] {\n  display: inline-block;\n  margin-right: 10px;\n  vertical-align: middle;\n}\n\nlabel {\n  display: inline-block;\n  font-size: 14px;\n  margin-right: 20px;\n  vertical-align: middle;\n}\n<\/style>\n<\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Binay\/HEX\/Decimal Converter Converted text display here! Convert Convert Convert Convert Convert Convert<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","footnotes":""},"class_list":["post-1462","page","type-page","status-publish"],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Billions Ideas","author_link":"https:\/\/tools.billionsideas.com\/pt\/author\/loginbillionsideas-com\/"},"comment_info":0,"jetpack-related-posts":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/pages\/1462","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/comments?post=1462"}],"version-history":[{"count":0,"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/pages\/1462\/revisions"}],"wp:attachment":[{"href":"https:\/\/tools.billionsideas.com\/pt\/wp-json\/wp\/v2\/media?parent=1462"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}