CTC Comparison<\/title>\n\n<style>\nbody {\n font-family: Arial;\n background: #f5f6fa;\n padding: 20px;\n}\n\n\/* HEADER *\/\n.header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 10px;\n}\n\n.toggle button {\n padding: 6px 14px;\n border: none;\n border-radius: 6px;\n cursor: pointer;\n background: #eee;\n}\n\n.toggle .active {\n background: #4b4bb7;\n color: #fff;\n}\n\n\/* TABLE *\/\n.table {\n background: #fff;\n border-radius: 10px;\n overflow: hidden;\n}\n\n.row {\n display: grid;\n grid-template-columns: 2fr 1fr 1fr;\n padding: 12px;\n border-bottom: 1px solid #eee;\n align-items: center;\n}\n\n.header-row {\n background: #f1f3f6;\n font-weight: bold;\n}\n\n.section {\n font-weight: bold;\n margin-top: 5px;\n}\n\n.highlight {\n background: #3b3b8f;\n color: white;\n font-weight: bold;\n}\n\n.green {\n background: #d4edda;\n font-weight: bold;\n}\n\n.small {\n font-size: 12px;\n color: #666;\n}\n<\/style>\n<\/head>\n\n<body>\n\n\n<div class=\"header\">\n <h2>Detailed CTC Comparison<\/h2>\n\n <div class=\"toggle\">\n <button id=\"monthlyBtn\" onclick=\"setMode('monthly')\">Monthly<\/button>\n <button id=\"annualBtn\" class=\"active\" onclick=\"setMode('annual')\">Annual<\/button>\n <\/div>\n<\/div>\n\n\n<div class=\"table\">\n\n<div class=\"row header-row\">\n <div>Pay Component<\/div>\n <div>Current Laws<\/div>\n <div>New Wage Code<\/div>\n<\/div>\n\n\n<div class=\"row\"><div>Basic Pay<\/div><div id=\"basic1\"><\/div><div id=\"basic2\"><\/div><\/div>\n<div class=\"row\"><div>DA<\/div><div id=\"da1\"><\/div><div id=\"da2\"><\/div><\/div>\n<div class=\"row\"><div>HRA<\/div><div id=\"hra1\"><\/div><div id=\"hra2\"><\/div><\/div>\n<div class=\"row\"><div>Special Allowance<\/div><div id=\"sp1\"><\/div><div id=\"sp2\"><\/div><\/div>\n\n\n<div class=\"row section\">\n <div>Total Remuneration (TR)<\/div>\n <div id=\"tr1\"><\/div>\n <div id=\"tr2\"><\/div>\n<\/div>\n\n<div class=\"row small\">\n <div>Wages for PF \/ Gratuity<\/div>\n <div id=\"wagePF1\"><\/div>\n <div id=\"wagePF2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Employer PF (12%)<\/div>\n <div id=\"pf1\"><\/div>\n <div id=\"pf2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Gratuity (4.81%)<\/div>\n <div id=\"grat1\"><\/div>\n <div id=\"grat2\"><\/div>\n<\/div>\n\n\n<div class=\"row highlight\">\n <div>Cost To Company (CTC)<\/div>\n <div id=\"ctc1\"><\/div>\n <div id=\"ctc2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Employee PF (12%)<\/div>\n <div id=\"empPf1\"><\/div>\n <div id=\"empPf2\"><\/div>\n<\/div>\n\n\n<div class=\"row green\">\n <div>Net Take-Home Pay<\/div>\n <div id=\"net1\"><\/div>\n <div id=\"net2\"><\/div>\n<\/div>\n\n<\/div>\n\n<script>\n\nlet mode = \"annual\";\n\nfunction setMode(type) {\n mode = type;\n\n document.getElementById(\"monthlyBtn\").classList.remove(\"active\");\n document.getElementById(\"annualBtn\").classList.remove(\"active\");\n\n document.getElementById(type + \"Btn\").classList.add(\"active\");\n\n calculate();\n}\n\nfunction calculate() {\n\n \/\/ INPUT VALUES (same as your screenshot)\n let basic = 600000;\n let da = 12000;\n let hra = 12000;\n let special = 12000;\n\n \/\/ NEW WAGE CODE (Basic \u2265 50%)\n let newBasic = basic;\n let newDa = da;\n\n \/\/ TOTAL REMUNERATION\n let tr = basic + da + hra + special;\n let trNew = newBasic + newDa + hra + special;\n\n \/\/ WAGES FOR PF\n let wagePF = basic + da;\n let wagePFNew = newBasic + newDa;\n\n \/\/ PF\n let pf = wagePF * 0.12;\n let pfNew = wagePFNew * 0.12;\n\n \/\/ GRATUITY\n let gratuity = wagePF * 0.0481;\n let gratuityNew = wagePFNew * 0.0481;\n\n \/\/ CTC\n let ctc = tr + pf + gratuity;\n let ctcNew = trNew + pfNew + gratuityNew;\n\n \/\/ NET\n let net = tr - pf;\n let netNew = trNew - pfNew;\n\n \/\/ Monthly conversion\n if (mode === \"monthly\") {\n tr\/=12; trNew\/=12;\n pf\/=12; pfNew\/=12;\n gratuity\/=12; gratuityNew\/=12;\n ctc\/=12; ctcNew\/=12;\n net\/=12; netNew\/=12;\n wagePF\/=12; wagePFNew\/=12;\n basic\/=12; newBasic\/=12;\n da\/=12; newDa\/=12;\n hra\/=12; special\/=12;\n }\n\n function set(id, val){\n document.getElementById(id).innerText = \"\u20b9\" + Math.round(val).toLocaleString();\n }\n\n \/\/ SET VALUES\n set(\"basic1\", basic); set(\"basic2\", newBasic);\n set(\"da1\", da); set(\"da2\", newDa);\n set(\"hra1\", hra); set(\"hra2\", hra);\n set(\"sp1\", special); set(\"sp2\", special);\n\n set(\"tr1\", tr); set(\"tr2\", trNew);\n set(\"wagePF1\", wagePF); set(\"wagePF2\", wagePFNew);\n\n set(\"pf1\", pf); set(\"pf2\", pfNew);\n set(\"grat1\", gratuity); set(\"grat2\", gratuityNew);\n\n set(\"ctc1\", ctc); set(\"ctc2\", ctcNew);\n\n set(\"empPf1\", pf); set(\"empPf2\", pfNew);\n\n set(\"net1\", net); set(\"net2\", netNew);\n}\n\ncalculate();\n\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CTC Comparison Detailed CTC Comparison Monthly Annual Pay Component Current Laws New Wage Code Basic Pay DA HRA Special Allowance Total Remuneration (TR) Wages for PF \/ Gratuity Employer PF (12%) Gratuity (4.81%) Cost To Company (CTC) Employee PF (12%) Net Take-Home Pay<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"newspack_featured_image_position":"","newspack_post_subtitle":"","newspack_article_summary_title":"Overview:","newspack_article_summary":"","newspack_hide_updated_date":false,"newspack_show_updated_date":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2648","post","type-post","status-publish","format-standard","hentry","category-uncategorized","entry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/comments?post=2648"}],"version-history":[{"count":5,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648\/revisions"}],"predecessor-version":[{"id":2655,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648\/revisions\/2655"}],"wp:attachment":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/media?parent=2648"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/categories?post=2648"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/tags?post=2648"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":2648,"date":"2026-04-04T12:40:46","date_gmt":"2026-04-04T12:40:46","guid":{"rendered":"https:\/\/www.key4comply.com\/staging\/?p=2648"},"modified":"2026-04-04T12:57:55","modified_gmt":"2026-04-04T12:57:55","slug":"ctc-calculator","status":"publish","type":"post","link":"https:\/\/www.key4comply.com\/staging\/uncategorized\/ctc-calculator","title":{"rendered":"CTC calculator"},"content":{"rendered":"\n\n\n\n\nCTC Comparison<\/title>\n\n<style>\nbody {\n font-family: Arial;\n background: #f5f6fa;\n padding: 20px;\n}\n\n\/* HEADER *\/\n.header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 10px;\n}\n\n.toggle button {\n padding: 6px 14px;\n border: none;\n border-radius: 6px;\n cursor: pointer;\n background: #eee;\n}\n\n.toggle .active {\n background: #4b4bb7;\n color: #fff;\n}\n\n\/* TABLE *\/\n.table {\n background: #fff;\n border-radius: 10px;\n overflow: hidden;\n}\n\n.row {\n display: grid;\n grid-template-columns: 2fr 1fr 1fr;\n padding: 12px;\n border-bottom: 1px solid #eee;\n align-items: center;\n}\n\n.header-row {\n background: #f1f3f6;\n font-weight: bold;\n}\n\n.section {\n font-weight: bold;\n margin-top: 5px;\n}\n\n.highlight {\n background: #3b3b8f;\n color: white;\n font-weight: bold;\n}\n\n.green {\n background: #d4edda;\n font-weight: bold;\n}\n\n.small {\n font-size: 12px;\n color: #666;\n}\n<\/style>\n<\/head>\n\n<body>\n\n\n<div class=\"header\">\n <h2>Detailed CTC Comparison<\/h2>\n\n <div class=\"toggle\">\n <button id=\"monthlyBtn\" onclick=\"setMode('monthly')\">Monthly<\/button>\n <button id=\"annualBtn\" class=\"active\" onclick=\"setMode('annual')\">Annual<\/button>\n <\/div>\n<\/div>\n\n\n<div class=\"table\">\n\n<div class=\"row header-row\">\n <div>Pay Component<\/div>\n <div>Current Laws<\/div>\n <div>New Wage Code<\/div>\n<\/div>\n\n\n<div class=\"row\"><div>Basic Pay<\/div><div id=\"basic1\"><\/div><div id=\"basic2\"><\/div><\/div>\n<div class=\"row\"><div>DA<\/div><div id=\"da1\"><\/div><div id=\"da2\"><\/div><\/div>\n<div class=\"row\"><div>HRA<\/div><div id=\"hra1\"><\/div><div id=\"hra2\"><\/div><\/div>\n<div class=\"row\"><div>Special Allowance<\/div><div id=\"sp1\"><\/div><div id=\"sp2\"><\/div><\/div>\n\n\n<div class=\"row section\">\n <div>Total Remuneration (TR)<\/div>\n <div id=\"tr1\"><\/div>\n <div id=\"tr2\"><\/div>\n<\/div>\n\n<div class=\"row small\">\n <div>Wages for PF \/ Gratuity<\/div>\n <div id=\"wagePF1\"><\/div>\n <div id=\"wagePF2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Employer PF (12%)<\/div>\n <div id=\"pf1\"><\/div>\n <div id=\"pf2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Gratuity (4.81%)<\/div>\n <div id=\"grat1\"><\/div>\n <div id=\"grat2\"><\/div>\n<\/div>\n\n\n<div class=\"row highlight\">\n <div>Cost To Company (CTC)<\/div>\n <div id=\"ctc1\"><\/div>\n <div id=\"ctc2\"><\/div>\n<\/div>\n\n\n<div class=\"row\">\n <div>Employee PF (12%)<\/div>\n <div id=\"empPf1\"><\/div>\n <div id=\"empPf2\"><\/div>\n<\/div>\n\n\n<div class=\"row green\">\n <div>Net Take-Home Pay<\/div>\n <div id=\"net1\"><\/div>\n <div id=\"net2\"><\/div>\n<\/div>\n\n<\/div>\n\n<script>\n\nlet mode = \"annual\";\n\nfunction setMode(type) {\n mode = type;\n\n document.getElementById(\"monthlyBtn\").classList.remove(\"active\");\n document.getElementById(\"annualBtn\").classList.remove(\"active\");\n\n document.getElementById(type + \"Btn\").classList.add(\"active\");\n\n calculate();\n}\n\nfunction calculate() {\n\n \/\/ INPUT VALUES (same as your screenshot)\n let basic = 600000;\n let da = 12000;\n let hra = 12000;\n let special = 12000;\n\n \/\/ NEW WAGE CODE (Basic \u2265 50%)\n let newBasic = basic;\n let newDa = da;\n\n \/\/ TOTAL REMUNERATION\n let tr = basic + da + hra + special;\n let trNew = newBasic + newDa + hra + special;\n\n \/\/ WAGES FOR PF\n let wagePF = basic + da;\n let wagePFNew = newBasic + newDa;\n\n \/\/ PF\n let pf = wagePF * 0.12;\n let pfNew = wagePFNew * 0.12;\n\n \/\/ GRATUITY\n let gratuity = wagePF * 0.0481;\n let gratuityNew = wagePFNew * 0.0481;\n\n \/\/ CTC\n let ctc = tr + pf + gratuity;\n let ctcNew = trNew + pfNew + gratuityNew;\n\n \/\/ NET\n let net = tr - pf;\n let netNew = trNew - pfNew;\n\n \/\/ Monthly conversion\n if (mode === \"monthly\") {\n tr\/=12; trNew\/=12;\n pf\/=12; pfNew\/=12;\n gratuity\/=12; gratuityNew\/=12;\n ctc\/=12; ctcNew\/=12;\n net\/=12; netNew\/=12;\n wagePF\/=12; wagePFNew\/=12;\n basic\/=12; newBasic\/=12;\n da\/=12; newDa\/=12;\n hra\/=12; special\/=12;\n }\n\n function set(id, val){\n document.getElementById(id).innerText = \"\u20b9\" + Math.round(val).toLocaleString();\n }\n\n \/\/ SET VALUES\n set(\"basic1\", basic); set(\"basic2\", newBasic);\n set(\"da1\", da); set(\"da2\", newDa);\n set(\"hra1\", hra); set(\"hra2\", hra);\n set(\"sp1\", special); set(\"sp2\", special);\n\n set(\"tr1\", tr); set(\"tr2\", trNew);\n set(\"wagePF1\", wagePF); set(\"wagePF2\", wagePFNew);\n\n set(\"pf1\", pf); set(\"pf2\", pfNew);\n set(\"grat1\", gratuity); set(\"grat2\", gratuityNew);\n\n set(\"ctc1\", ctc); set(\"ctc2\", ctcNew);\n\n set(\"empPf1\", pf); set(\"empPf2\", pfNew);\n\n set(\"net1\", net); set(\"net2\", netNew);\n}\n\ncalculate();\n\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CTC Comparison Detailed CTC Comparison Monthly Annual Pay Component Current Laws New Wage Code Basic Pay DA HRA Special Allowance Total Remuneration (TR) Wages for PF \/ Gratuity Employer PF (12%) Gratuity (4.81%) Cost To Company (CTC) Employee PF (12%) Net Take-Home Pay<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"newspack_featured_image_position":"","newspack_post_subtitle":"","newspack_article_summary_title":"Overview:","newspack_article_summary":"","newspack_hide_updated_date":false,"newspack_show_updated_date":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2648","post","type-post","status-publish","format-standard","hentry","category-uncategorized","entry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/comments?post=2648"}],"version-history":[{"count":5,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648\/revisions"}],"predecessor-version":[{"id":2655,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/posts\/2648\/revisions\/2655"}],"wp:attachment":[{"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/media?parent=2648"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/categories?post=2648"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.key4comply.com\/staging\/wp-json\/wp\/v2\/tags?post=2648"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}