Unit Conversion<\/title>\n<\/head>\n<body>\n\n <h1>Unit Conversion<\/h1>\n\n <p>Place to convert units! Here’s a simple converter.<\/p>\n\n <label for=\"number\">Number:<\/label>\n <input type=\"number\" id=\"number\" name=\"number\">\n\n <label for=\"unit\">Unit:<\/label>\n <select id=\"unit\" name=\"unit\">\n <option value=\"meter\">Meter<\/option>\n <option value=\"kilometer\">Kilometer<\/option>\n <option value=\"mile\">Mile<\/option>\n <option value=\"foot\">Foot<\/option>\n <option value=\"inch\">Inch<\/option>\n <option value=\"yard\">Yard<\/option>\n <\/select>\n\n <label for=\"unit_label\">Unit:<\/label>\n <select id=\"unit_label\" name=\"unit_label\">\n <option value=\"meter\">Meter<\/option>\n <option value=\"kilometer\">Kilometer<\/option>\n <option value=\"mile\">Mile<\/option>\n <option value=\"foot\">Foot<\/option>\n <option value=\"inch\">Inch<\/option>\n <option value=\"yard\">Yard<\/option>\n <\/select>\n\n <button>Convert<\/button>\n\n<\/body>\n<\/html>\n\n\n\n<p>Calculation on unit conversion calculation<\/p>\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>Unit Conversion Calculator<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n margin: 20px;\n }\n .input-container {\n margin-bottom: 20px;\n }\n input[type=\"number\"] {\n width: 200px;\n padding: 5px;\n border: 1px solid #ccc;\n border-radius: 4px;\n }\n button {\n padding: 8px 16px;\n background-color: #4CAF50;\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n }\n button:hover {\n background-color: #3e8e41;\n }\n <\/style>\n<\/head>\n<body>\n\n <h1>Unit Conversion Calculator<\/h1>\n\n <div class=\"input-container\">\n <label for=\"number\">Enter Number:<\/label>\n <input type=\"number\" id=\"number\" name=\"number\">\n <br>\n <label for=\"unit\">Select Unit:<\/label>\n <select id=\"unit\" name=\"unit\">\n <option value=\"kg\">Kilograms<\/option>\n <option value=\"g\">Grams<\/option>\n <option value=\"lbs\"> Pounds<\/option>\n <option value=\"m\"> Meters<\/option>\n <option value=\"cm\"> Centimeters<\/option>\n <\/select>\n <br>\n <button onclick=\"calculateConversion()\">Calculate<\/button>\n <\/div>\n\n <div id=\"result\"><\/div>\n\n <script>\n function calculateConversion() {\n var inputNumber = document.getElementById(\"number\").value;\n var unitChoice = document.getElementById(\"unit\").value;\n\n let result = \"\";\n\n if (inputNumber === \"0\") {\n result = \"Please enter a valid number.\";\n } else if (unitChoice === \"kg\") {\n result = \"1 kg = \" + inputNumber \/ 1000 + \" kg\";\n } else if (unitChoice === \"g\") {\n result = \"1 g = \" + inputNumber + \" g\";\n } else if (unitChoice === \"lbs\") {\n result = \"1 lb = \" + inputNumber * 0.453592 + \" lb\";\n } else if (unitChoice === \"m\") {\n result = \"1 m = \" + inputNumber + \" m\";\n } else if (unitChoice === \"cm\") {\n result = \"1 cm = \" + inputNumber + \" cm\";\n } else {\n result = \"Invalid unit choice.\";\n }\n\n document.getElementById(\"result\").innerHTML = result;\n }\n <\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p>Konversi Temperatur<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Konversi Suhu Lengkap<\/title>\n <style>\n body {\n font-family: \"Segoe UI\", Arial, sans-serif;\n margin: 0;\n padding: 0;\n background-color: #2c2f33; \/* abu gelap *\/\n color: #f0f0f0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n min-height: 100vh;\n padding: 40px 20px;\n }\n\n h2 {\n margin-bottom: 20px;\n font-size: 28px;\n color: #ffffff;\n text-shadow: 1px 1px 4px rgba(0,0,0,0.6);\n }\n\n input, select, button {\n padding: 10px 12px;\n margin: 8px;\n font-size: 16px;\n border-radius: 8px;\n border: none;\n outline: none;\n }\n\n input, select {\n background-color: #3b3f45;\n color: #ffffff;\n }\n\n button {\n background-color: #5865f2;\n color: #fff;\n cursor: pointer;\n transition: background 0.3s;\n }\n\n button:hover {\n background-color: #4752c4;\n }\n\n #hasil {\n margin-top: 30px;\n width: 100%;\n max-width: 400px;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n background-color: #3b3f45;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 4px 12px rgba(0,0,0,0.5);\n }\n\n th, td {\n padding: 12px 16px;\n text-align: center;\n }\n\n th {\n background-color: #5865f2;\n color: #ffffff;\n font-weight: bold;\n }\n\n tr:nth-child(even) td {\n background-color: #32363c;\n }\n <\/style>\n<\/head>\n<body>\n <h2>Konversi Suhu Lengkap<\/h2>\n <div>\n <input type=\"number\" id=\"nilai\" placeholder=\"Masukkan suhu\">\n <select id=\"satuan\">\n <option value=\"C\">Celcius (\u00b0C)<\/option>\n <option value=\"F\">Fahrenheit (\u00b0F)<\/option>\n <option value=\"R\">Reamur (\u00b0R)<\/option>\n <option value=\"K\">Kelvin (K)<\/option>\n <\/select>\n <button onclick=\"konversi()\">Konversi<\/button>\n <\/div>\n\n <div id=\"hasil\"><\/div>\n\n <script>\n function konversi() {\n let nilai = parseFloat(document.getElementById(\"nilai\").value);\n let satuan = document.getElementById(\"satuan\").value;\n let c, f, r, k;\n\n if (isNaN(nilai)) {\n document.getElementById(\"hasil\").innerHTML = \"<p style='color:#ff6b6b;'>Masukkan angka yang valid!<\/p>\";\n return;\n }\n\n \/\/ Konversi ke Celcius\n switch(satuan) {\n case \"C\":\n c = nilai;\n break;\n case \"F\":\n c = (nilai - 32) * 5\/9;\n break;\n case \"R\":\n c = nilai * 5\/4;\n break;\n case \"K\":\n c = nilai - 273.15;\n break;\n }\n\n \/\/ Dari Celcius ke semua\n f = (c * 9\/5) + 32;\n r = c * 4\/5;\n k = c + 273.15;\n\n document.getElementById(\"hasil\").innerHTML = `\n <table>\n <tr><th>Satuan<\/th><th>Hasil<\/th><\/tr>\n <tr><td>Celcius (\u00b0C)<\/td><td>${c.toFixed(2)}<\/td><\/tr>\n <tr><td>Fahrenheit (\u00b0F)<\/td><td>${f.toFixed(2)}<\/td><\/tr>\n <tr><td>Reamur (\u00b0R)<\/td><td>${r.toFixed(2)}<\/td><\/tr>\n <tr><td>Kelvin (K)<\/td><td>${k.toFixed(2)}<\/td><\/tr>\n <\/table>\n `;\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p>Kinetic Energy Calculator<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Kalkulator Energi Kinetik<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #121212; \/* Background gelap elegan *\/\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n margin: 0;\n color: #e0e0e0;\n }\n .container {\n background: #1e1e1e; \/* Kotak abu-abu gelap *\/\n padding: 25px 35px;\n border-radius: 14px;\n box-shadow: 0 6px 20px rgba(0,0,0,0.6);\n max-width: 420px;\n text-align: center;\n transition: 0.3s;\n }\n .container:hover {\n box-shadow: 0 8px 28px rgba(0,0,0,0.8);\n }\n h2 {\n margin-bottom: 20px;\n color: #ffffff;\n font-size: 1.5em;\n }\n label {\n display: block;\n margin-top: 12px;\n margin-bottom: 6px;\n font-weight: 500;\n color: #bbbbbb;\n text-align: left;\n }\n input, select {\n width: 100%;\n padding: 12px;\n margin-bottom: 12px;\n border: 1px solid #333;\n border-radius: 8px;\n background: #2a2a2a;\n color: #e0e0e0;\n font-size: 1em;\n outline: none;\n transition: border 0.2s;\n }\n input:focus, select:focus {\n border: 1px solid #0077cc;\n }\n button {\n background: #0077cc;\n color: white;\n border: none;\n padding: 12px 24px;\n margin: 10px 5px;\n border-radius: 8px;\n cursor: pointer;\n font-size: 1em;\n font-weight: 600;\n transition: background 0.3s;\n }\n button:hover {\n background: #005fa3;\n }\n .reset-btn {\n background: #d9534f;\n }\n .reset-btn:hover {\n background: #b52b27;\n }\n .result {\n margin-top: 20px;\n font-weight: bold;\n font-size: 1.2em;\n color: #00d4ff;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <h2>Kalkulator Energi Kinetik<\/h2>\n \n \n <label for=\"massa\">Massa:<\/label>\n <input type=\"number\" id=\"massa\" placeholder=\"Masukkan massa\">\n <select id=\"satuanMassa\">\n <option value=\"kg\">kg<\/option>\n <option value=\"g\">gram<\/option>\n <\/select>\n \n \n <label for=\"kecepatan\">Kecepatan:<\/label>\n <input type=\"number\" id=\"kecepatan\" placeholder=\"Masukkan kecepatan\">\n <select id=\"satuanKecepatan\">\n <option value=\"ms\">m\/s<\/option>\n <option value=\"kmh\">km\/jam<\/option>\n <\/select>\n \n \n <label for=\"satuanHasil\">Tampilkan Hasil Dalam:<\/label>\n <select id=\"satuanHasil\">\n <option value=\"J\">Joule (J)<\/option>\n <option value=\"kJ\">Kilojoule (kJ)<\/option>\n <option value=\"cal\">Kalori (cal)<\/option>\n <\/select>\n \n \n <div>\n <button onclick=\"hitungEnergi()\">Hitung<\/button>\n <button class=\"reset-btn\" onclick=\"resetForm()\">Reset<\/button>\n <\/div>\n \n \n <div class=\"result\" id=\"hasil\"><\/div>\n <\/div>\n\n <script>\n function hitungEnergi() {\n let m = parseFloat(document.getElementById(\"massa\").value);\n let v = parseFloat(document.getElementById(\"kecepatan\").value);\n let satuanM = document.getElementById(\"satuanMassa\").value;\n let satuanV = document.getElementById(\"satuanKecepatan\").value;\n let satuanHasil = document.getElementById(\"satuanHasil\").value;\n\n if (isNaN(m) || isNaN(v)) {\n document.getElementById(\"hasil\").innerText = \"Mohon masukkan angka yang valid.\";\n return;\n }\n\n \/\/ Konversi ke SI\n if (satuanM === \"g\") {\n m = m \/ 1000; \/\/ gram ke kilogram\n }\n if (satuanV === \"kmh\") {\n v = v \/ 3.6; \/\/ km\/jam ke m\/s\n }\n\n \/\/ Hitung energi dalam Joule\n let Ek = 0.5 * m * v * v;\n let hasilTeks = \"\";\n\n \/\/ Konversi sesuai pilihan hasil\n if (satuanHasil === \"J\") {\n hasilTeks = Ek.toFixed(2) + \" Joule\";\n } else if (satuanHasil === \"kJ\") {\n hasilTeks = (Ek \/ 1000).toFixed(4) + \" Kilojoule\";\n } else if (satuanHasil === \"cal\") {\n hasilTeks = (Ek \/ 4.184).toFixed(2) + \" Kalori\";\n }\n\n document.getElementById(\"hasil\").innerText = \"Energi Kinetik: \" + hasilTeks;\n }\n\n function resetForm() {\n document.getElementById(\"massa\").value = \"\";\n document.getElementById(\"kecepatan\").value = \"\";\n document.getElementById(\"satuanMassa\").value = \"kg\";\n document.getElementById(\"satuanKecepatan\").value = \"ms\";\n document.getElementById(\"satuanHasil\").value = \"J\";\n document.getElementById(\"hasil\").innerText = \"\";\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Note on How To Use: Unit Conversion Unit Conversion Place to convert units! Here’s a simple converter. Number: Unit: MeterKilometerMileFootInchYard Unit: MeterKilometerMileFootInchYard Convert Calculation on unit conversion calculation Unit Conversion Calculator Unit Conversion Calculator Enter Number: Select Unit: KilogramsGrams Pounds Meters Centimeters Calculate Konversi Temperatur Konversi Suhu Lengkap Konversi Suhu Lengkap Celcius (\u00b0C)Fahrenheit (\u00b0F)Reamur (\u00b0R)Kelvin […]<\/p>\n","protected":false},"author":208,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[26],"tags":[],"class_list":["post-8234","post","type-post","status-publish","format-standard","hentry","category-general"],"_links":{"self":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/users\/208"}],"replies":[{"embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/comments?post=8234"}],"version-history":[{"count":10,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234\/revisions"}],"predecessor-version":[{"id":8562,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234\/revisions\/8562"}],"wp:attachment":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/media?parent=8234"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/categories?post=8234"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/tags?post=8234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":8234,"date":"2025-09-05T01:46:14","date_gmt":"2025-09-05T01:46:14","guid":{"rendered":"https:\/\/ccitonline.com\/wp\/?p=8234"},"modified":"2025-09-15T10:39:08","modified_gmt":"2025-09-15T10:39:08","slug":"coding-territory-rizky-nugraha","status":"publish","type":"post","link":"https:\/\/ccitonline.com\/wp\/2025\/09\/05\/coding-territory-rizky-nugraha\/","title":{"rendered":"Coding Territory -Rizky Nugraha"},"content":{"rendered":"\n

Note on How To Use:<\/p>\n\n\n\n

Save the code as an HTML file (e.g., heat_loss_calculator.html<\/code>).<\/li>\n\n\n\n
Open the file in a web browser.<\/li>\n<\/ol>\n\n\n\n\n\n\n Unit Conversion<\/title>\n<\/head>\n<body>\n\n <h1>Unit Conversion<\/h1>\n\n <p>Place to convert units! Here’s a simple converter.<\/p>\n\n <label for=\"number\">Number:<\/label>\n <input type=\"number\" id=\"number\" name=\"number\">\n\n <label for=\"unit\">Unit:<\/label>\n <select id=\"unit\" name=\"unit\">\n <option value=\"meter\">Meter<\/option>\n <option value=\"kilometer\">Kilometer<\/option>\n <option value=\"mile\">Mile<\/option>\n <option value=\"foot\">Foot<\/option>\n <option value=\"inch\">Inch<\/option>\n <option value=\"yard\">Yard<\/option>\n <\/select>\n\n <label for=\"unit_label\">Unit:<\/label>\n <select id=\"unit_label\" name=\"unit_label\">\n <option value=\"meter\">Meter<\/option>\n <option value=\"kilometer\">Kilometer<\/option>\n <option value=\"mile\">Mile<\/option>\n <option value=\"foot\">Foot<\/option>\n <option value=\"inch\">Inch<\/option>\n <option value=\"yard\">Yard<\/option>\n <\/select>\n\n <button>Convert<\/button>\n\n<\/body>\n<\/html>\n\n\n\n<p>Calculation on unit conversion calculation<\/p>\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>Unit Conversion Calculator<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n margin: 20px;\n }\n .input-container {\n margin-bottom: 20px;\n }\n input[type=\"number\"] {\n width: 200px;\n padding: 5px;\n border: 1px solid #ccc;\n border-radius: 4px;\n }\n button {\n padding: 8px 16px;\n background-color: #4CAF50;\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n }\n button:hover {\n background-color: #3e8e41;\n }\n <\/style>\n<\/head>\n<body>\n\n <h1>Unit Conversion Calculator<\/h1>\n\n <div class=\"input-container\">\n <label for=\"number\">Enter Number:<\/label>\n <input type=\"number\" id=\"number\" name=\"number\">\n <br>\n <label for=\"unit\">Select Unit:<\/label>\n <select id=\"unit\" name=\"unit\">\n <option value=\"kg\">Kilograms<\/option>\n <option value=\"g\">Grams<\/option>\n <option value=\"lbs\"> Pounds<\/option>\n <option value=\"m\"> Meters<\/option>\n <option value=\"cm\"> Centimeters<\/option>\n <\/select>\n <br>\n <button onclick=\"calculateConversion()\">Calculate<\/button>\n <\/div>\n\n <div id=\"result\"><\/div>\n\n <script>\n function calculateConversion() {\n var inputNumber = document.getElementById(\"number\").value;\n var unitChoice = document.getElementById(\"unit\").value;\n\n let result = \"\";\n\n if (inputNumber === \"0\") {\n result = \"Please enter a valid number.\";\n } else if (unitChoice === \"kg\") {\n result = \"1 kg = \" + inputNumber \/ 1000 + \" kg\";\n } else if (unitChoice === \"g\") {\n result = \"1 g = \" + inputNumber + \" g\";\n } else if (unitChoice === \"lbs\") {\n result = \"1 lb = \" + inputNumber * 0.453592 + \" lb\";\n } else if (unitChoice === \"m\") {\n result = \"1 m = \" + inputNumber + \" m\";\n } else if (unitChoice === \"cm\") {\n result = \"1 cm = \" + inputNumber + \" cm\";\n } else {\n result = \"Invalid unit choice.\";\n }\n\n document.getElementById(\"result\").innerHTML = result;\n }\n <\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p>Konversi Temperatur<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Konversi Suhu Lengkap<\/title>\n <style>\n body {\n font-family: \"Segoe UI\", Arial, sans-serif;\n margin: 0;\n padding: 0;\n background-color: #2c2f33; \/* abu gelap *\/\n color: #f0f0f0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n min-height: 100vh;\n padding: 40px 20px;\n }\n\n h2 {\n margin-bottom: 20px;\n font-size: 28px;\n color: #ffffff;\n text-shadow: 1px 1px 4px rgba(0,0,0,0.6);\n }\n\n input, select, button {\n padding: 10px 12px;\n margin: 8px;\n font-size: 16px;\n border-radius: 8px;\n border: none;\n outline: none;\n }\n\n input, select {\n background-color: #3b3f45;\n color: #ffffff;\n }\n\n button {\n background-color: #5865f2;\n color: #fff;\n cursor: pointer;\n transition: background 0.3s;\n }\n\n button:hover {\n background-color: #4752c4;\n }\n\n #hasil {\n margin-top: 30px;\n width: 100%;\n max-width: 400px;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n background-color: #3b3f45;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 4px 12px rgba(0,0,0,0.5);\n }\n\n th, td {\n padding: 12px 16px;\n text-align: center;\n }\n\n th {\n background-color: #5865f2;\n color: #ffffff;\n font-weight: bold;\n }\n\n tr:nth-child(even) td {\n background-color: #32363c;\n }\n <\/style>\n<\/head>\n<body>\n <h2>Konversi Suhu Lengkap<\/h2>\n <div>\n <input type=\"number\" id=\"nilai\" placeholder=\"Masukkan suhu\">\n <select id=\"satuan\">\n <option value=\"C\">Celcius (\u00b0C)<\/option>\n <option value=\"F\">Fahrenheit (\u00b0F)<\/option>\n <option value=\"R\">Reamur (\u00b0R)<\/option>\n <option value=\"K\">Kelvin (K)<\/option>\n <\/select>\n <button onclick=\"konversi()\">Konversi<\/button>\n <\/div>\n\n <div id=\"hasil\"><\/div>\n\n <script>\n function konversi() {\n let nilai = parseFloat(document.getElementById(\"nilai\").value);\n let satuan = document.getElementById(\"satuan\").value;\n let c, f, r, k;\n\n if (isNaN(nilai)) {\n document.getElementById(\"hasil\").innerHTML = \"<p style='color:#ff6b6b;'>Masukkan angka yang valid!<\/p>\";\n return;\n }\n\n \/\/ Konversi ke Celcius\n switch(satuan) {\n case \"C\":\n c = nilai;\n break;\n case \"F\":\n c = (nilai - 32) * 5\/9;\n break;\n case \"R\":\n c = nilai * 5\/4;\n break;\n case \"K\":\n c = nilai - 273.15;\n break;\n }\n\n \/\/ Dari Celcius ke semua\n f = (c * 9\/5) + 32;\n r = c * 4\/5;\n k = c + 273.15;\n\n document.getElementById(\"hasil\").innerHTML = `\n <table>\n <tr><th>Satuan<\/th><th>Hasil<\/th><\/tr>\n <tr><td>Celcius (\u00b0C)<\/td><td>${c.toFixed(2)}<\/td><\/tr>\n <tr><td>Fahrenheit (\u00b0F)<\/td><td>${f.toFixed(2)}<\/td><\/tr>\n <tr><td>Reamur (\u00b0R)<\/td><td>${r.toFixed(2)}<\/td><\/tr>\n <tr><td>Kelvin (K)<\/td><td>${k.toFixed(2)}<\/td><\/tr>\n <\/table>\n `;\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p>Kinetic Energy Calculator<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Kalkulator Energi Kinetik<\/title>\n <style>\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #121212; \/* Background gelap elegan *\/\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n margin: 0;\n color: #e0e0e0;\n }\n .container {\n background: #1e1e1e; \/* Kotak abu-abu gelap *\/\n padding: 25px 35px;\n border-radius: 14px;\n box-shadow: 0 6px 20px rgba(0,0,0,0.6);\n max-width: 420px;\n text-align: center;\n transition: 0.3s;\n }\n .container:hover {\n box-shadow: 0 8px 28px rgba(0,0,0,0.8);\n }\n h2 {\n margin-bottom: 20px;\n color: #ffffff;\n font-size: 1.5em;\n }\n label {\n display: block;\n margin-top: 12px;\n margin-bottom: 6px;\n font-weight: 500;\n color: #bbbbbb;\n text-align: left;\n }\n input, select {\n width: 100%;\n padding: 12px;\n margin-bottom: 12px;\n border: 1px solid #333;\n border-radius: 8px;\n background: #2a2a2a;\n color: #e0e0e0;\n font-size: 1em;\n outline: none;\n transition: border 0.2s;\n }\n input:focus, select:focus {\n border: 1px solid #0077cc;\n }\n button {\n background: #0077cc;\n color: white;\n border: none;\n padding: 12px 24px;\n margin: 10px 5px;\n border-radius: 8px;\n cursor: pointer;\n font-size: 1em;\n font-weight: 600;\n transition: background 0.3s;\n }\n button:hover {\n background: #005fa3;\n }\n .reset-btn {\n background: #d9534f;\n }\n .reset-btn:hover {\n background: #b52b27;\n }\n .result {\n margin-top: 20px;\n font-weight: bold;\n font-size: 1.2em;\n color: #00d4ff;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <h2>Kalkulator Energi Kinetik<\/h2>\n \n \n <label for=\"massa\">Massa:<\/label>\n <input type=\"number\" id=\"massa\" placeholder=\"Masukkan massa\">\n <select id=\"satuanMassa\">\n <option value=\"kg\">kg<\/option>\n <option value=\"g\">gram<\/option>\n <\/select>\n \n \n <label for=\"kecepatan\">Kecepatan:<\/label>\n <input type=\"number\" id=\"kecepatan\" placeholder=\"Masukkan kecepatan\">\n <select id=\"satuanKecepatan\">\n <option value=\"ms\">m\/s<\/option>\n <option value=\"kmh\">km\/jam<\/option>\n <\/select>\n \n \n <label for=\"satuanHasil\">Tampilkan Hasil Dalam:<\/label>\n <select id=\"satuanHasil\">\n <option value=\"J\">Joule (J)<\/option>\n <option value=\"kJ\">Kilojoule (kJ)<\/option>\n <option value=\"cal\">Kalori (cal)<\/option>\n <\/select>\n \n \n <div>\n <button onclick=\"hitungEnergi()\">Hitung<\/button>\n <button class=\"reset-btn\" onclick=\"resetForm()\">Reset<\/button>\n <\/div>\n \n \n <div class=\"result\" id=\"hasil\"><\/div>\n <\/div>\n\n <script>\n function hitungEnergi() {\n let m = parseFloat(document.getElementById(\"massa\").value);\n let v = parseFloat(document.getElementById(\"kecepatan\").value);\n let satuanM = document.getElementById(\"satuanMassa\").value;\n let satuanV = document.getElementById(\"satuanKecepatan\").value;\n let satuanHasil = document.getElementById(\"satuanHasil\").value;\n\n if (isNaN(m) || isNaN(v)) {\n document.getElementById(\"hasil\").innerText = \"Mohon masukkan angka yang valid.\";\n return;\n }\n\n \/\/ Konversi ke SI\n if (satuanM === \"g\") {\n m = m \/ 1000; \/\/ gram ke kilogram\n }\n if (satuanV === \"kmh\") {\n v = v \/ 3.6; \/\/ km\/jam ke m\/s\n }\n\n \/\/ Hitung energi dalam Joule\n let Ek = 0.5 * m * v * v;\n let hasilTeks = \"\";\n\n \/\/ Konversi sesuai pilihan hasil\n if (satuanHasil === \"J\") {\n hasilTeks = Ek.toFixed(2) + \" Joule\";\n } else if (satuanHasil === \"kJ\") {\n hasilTeks = (Ek \/ 1000).toFixed(4) + \" Kilojoule\";\n } else if (satuanHasil === \"cal\") {\n hasilTeks = (Ek \/ 4.184).toFixed(2) + \" Kalori\";\n }\n\n document.getElementById(\"hasil\").innerText = \"Energi Kinetik: \" + hasilTeks;\n }\n\n function resetForm() {\n document.getElementById(\"massa\").value = \"\";\n document.getElementById(\"kecepatan\").value = \"\";\n document.getElementById(\"satuanMassa\").value = \"kg\";\n document.getElementById(\"satuanKecepatan\").value = \"ms\";\n document.getElementById(\"satuanHasil\").value = \"J\";\n document.getElementById(\"hasil\").innerText = \"\";\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Note on How To Use: Unit Conversion Unit Conversion Place to convert units! Here’s a simple converter. Number: Unit: MeterKilometerMileFootInchYard Unit: MeterKilometerMileFootInchYard Convert Calculation on unit conversion calculation Unit Conversion Calculator Unit Conversion Calculator Enter Number: Select Unit: KilogramsGrams Pounds Meters Centimeters Calculate Konversi Temperatur Konversi Suhu Lengkap Konversi Suhu Lengkap Celcius (\u00b0C)Fahrenheit (\u00b0F)Reamur (\u00b0R)Kelvin […]<\/p>\n","protected":false},"author":208,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[26],"tags":[],"class_list":["post-8234","post","type-post","status-publish","format-standard","hentry","category-general"],"_links":{"self":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/users\/208"}],"replies":[{"embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/comments?post=8234"}],"version-history":[{"count":10,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234\/revisions"}],"predecessor-version":[{"id":8562,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/posts\/8234\/revisions\/8562"}],"wp:attachment":[{"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/media?parent=8234"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/categories?post=8234"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ccitonline.com\/wp\/wp-json\/wp\/v2\/tags?post=8234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}