{"id":3298,"date":"2026-02-05T16:42:57","date_gmt":"2026-02-05T16:42:57","guid":{"rendered":"https:\/\/osescore.com\/?page_id=3298"},"modified":"2026-02-05T16:42:57","modified_gmt":"2026-02-05T16:42:57","slug":"credit-score-simulator","status":"publish","type":"page","link":"https:\/\/osescore.com\/?page_id=3298","title":{"rendered":"Credit Score Simulator"},"content":{"rendered":"\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n\n<div style=\"max-width: 900px; margin: 2rem auto; background: white; border-radius: 1rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1); overflow: hidden;\">\n    \n    <!-- Header -->\n    <div style=\"background: linear-gradient(135deg, #0A1325 0%, #1a2742 100%); padding: 2rem; text-align: center;\">\n        <h1 style=\"font-size: 2rem; font-weight: bold; color: white; margin-bottom: 0.5rem;\">Credit Score Simulator<\/h1>\n        <p style=\"color: #E6E6E6; font-size: 1rem;\">See how paying off debt can improve your credit score<\/p>\n    <\/div>\n\n    <div style=\"padding: 2rem;\">\n        \n        <!-- Current Score Display -->\n        <div style=\"text-align: center; margin-bottom: 2rem;\">\n            <div style=\"position: relative; width: 280px; height: 280px; margin: 0 auto;\">\n                <!-- SVG Gauge -->\n                <svg viewBox=\"0 0 200 120\" style=\"width: 100%; height: auto;\">\n                    <!-- Background arc -->\n                    <path d=\"M 20 100 A 80 80 0 0 1 180 100\" \n                          fill=\"none\" \n                          stroke=\"#E6E6E6\" \n                          stroke-width=\"20\" \n                          stroke-linecap=\"round\"\/>\n                    <!-- Colored segments -->\n                    <path id=\"scoreArc\" \n                          d=\"M 20 100 A 80 80 0 0 1 180 100\" \n                          fill=\"none\" \n                          stroke=\"#dc2626\" \n                          stroke-width=\"20\" \n                          stroke-linecap=\"round\"\n                          stroke-dasharray=\"251.2\"\n                          stroke-dashoffset=\"251.2\"\n                          style=\"transition: all 1s ease;\"\/>\n                    <!-- Center text -->\n                    <text x=\"100\" y=\"85\" text-anchor=\"middle\" style=\"font-size: 36px; font-weight: bold; fill: #0A1325;\" id=\"scoreText\">300<\/text>\n                    <text x=\"100\" y=\"105\" text-anchor=\"middle\" style=\"font-size: 12px; fill: #8A8A8A;\" id=\"scoreCategory\">Poor<\/text>\n                <\/svg>\n            <\/div>\n        <\/div>\n\n        <!-- Input Sections -->\n        <div style=\"display: grid; grid-template-columns: 1fr; gap: 1.5rem; max-width: 600px; margin: 0 auto;\">\n            \n            <!-- Credit Card Debt -->\n            <div style=\"background: #F5F5F5; padding: 1.5rem; border-radius: 0.75rem; border: 2px solid #E6E6E6;\">\n                <h3 style=\"font-size: 1.1rem; font-weight: 600; color: #0A1325; margin-bottom: 1rem;\">Credit Card Debt<\/h3>\n                \n                <div style=\"margin-bottom: 1rem;\">\n                    <label style=\"display: block; font-size: 0.875rem; font-weight: 500; color: #0A1325; margin-bottom: 0.5rem;\">Total Credit Card Balance<\/label>\n                    <div style=\"display: flex; align-items: center; background: white; border: 2px solid #C0C0C0; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                        <span style=\"color: #8A8A8A; font-weight: 500; margin-right: 0.5rem;\">$<\/span>\n                        <input type=\"number\" id=\"totalDebt\" value=\"8000\" min=\"0\" step=\"100\" oninput=\"calculateCreditScore()\"\n                            style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                    <\/div>\n                <\/div>\n\n                <div>\n                    <label style=\"display: block; font-size: 0.875rem; font-weight: 500; color: #0A1325; margin-bottom: 0.5rem;\">Total Credit Limit<\/label>\n                    <div style=\"display: flex; align-items: center; background: white; border: 2px solid #C0C0C0; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                        <span style=\"color: #8A8A8A; font-weight: 500; margin-right: 0.5rem;\">$<\/span>\n                        <input type=\"number\" id=\"totalLimit\" value=\"12000\" min=\"0\" step=\"100\" oninput=\"calculateCreditScore()\"\n                            style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Payment History -->\n            <div style=\"background: #F5F5F5; padding: 1.5rem; border-radius: 0.75rem; border: 2px solid #E6E6E6;\">\n                <h3 style=\"font-size: 1.1rem; font-weight: 600; color: #0A1325; margin-bottom: 1rem;\">Payment History<\/h3>\n                \n                <div>\n                    <label style=\"display: block; font-size: 0.875rem; font-weight: 500; color: #0A1325; margin-bottom: 0.5rem;\">On-Time Payments (Last 24 Months)<\/label>\n                    <div style=\"display: flex; align-items: center; background: white; border: 2px solid #C0C0C0; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                        <input type=\"number\" id=\"onTimePayments\" value=\"24\" min=\"0\" max=\"24\" step=\"1\" oninput=\"calculateCreditScore()\"\n                            style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                        <span style=\"color: #8A8A8A; font-weight: 500; margin-left: 0.5rem;\">\/ 24<\/span>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Credit Account Activity -->\n            <div style=\"background: #F5F5F5; padding: 1.5rem; border-radius: 0.75rem; border: 2px solid #E6E6E6;\">\n                <h3 style=\"font-size: 1.1rem; font-weight: 600; color: #0A1325; margin-bottom: 1rem;\">Account Activity<\/h3>\n                \n                <div style=\"margin-bottom: 1rem;\">\n                    <label style=\"display: block; font-size: 0.875rem; font-weight: 500; color: #0A1325; margin-bottom: 0.5rem;\">New Accounts (Last 12 Months)<\/label>\n                    <div style=\"display: flex; align-items: center; background: white; border: 2px solid #C0C0C0; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                        <input type=\"number\" id=\"newAccounts\" value=\"1\" min=\"0\" max=\"20\" step=\"1\" oninput=\"calculateCreditScore()\"\n                            style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                    <\/div>\n                <\/div>\n\n                <div>\n                    <label style=\"display: block; font-size: 0.875rem; font-weight: 500; color: #0A1325; margin-bottom: 0.5rem;\">Hard Inquiries (Last 12 Months)<\/label>\n                    <div style=\"display: flex; align-items: center; background: white; border: 2px solid #C0C0C0; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                        <input type=\"number\" id=\"hardInquiries\" value=\"2\" min=\"0\" max=\"20\" step=\"1\" oninput=\"calculateCreditScore()\"\n                            style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                    <\/div>\n                <\/div>\n            <\/div>\n\n        <\/div>\n\n        <!-- Projection Section -->\n        <div style=\"margin-top: 2rem; padding: 1.5rem; background: linear-gradient(135deg, #f6dca9 0%, #f5d299 100%); border-radius: 0.75rem; border: 2px solid #0A1325;\">\n            <h3 style=\"font-size: 1.25rem; font-weight: 700; color: #0A1325; margin-bottom: 1rem; text-align: center;\">Debt Payoff Projection<\/h3>\n            \n            <div style=\"margin-bottom: 1rem;\">\n                <label style=\"display: block; font-size: 0.875rem; font-weight: 600; color: #0A1325; margin-bottom: 0.5rem;\">How much will you pay off?<\/label>\n                <div style=\"display: flex; align-items: center; background: white; border: 2px solid #0A1325; border-radius: 0.5rem; padding: 0.75rem 1rem;\">\n                    <span style=\"color: #0A1325; font-weight: 500; margin-right: 0.5rem;\">$<\/span>\n                    <input type=\"number\" id=\"payoffAmount\" value=\"3000\" min=\"0\" step=\"100\" oninput=\"calculateProjectedScore()\"\n                        style=\"border: none; outline: none; width: 100%; font-size: 1rem; background: transparent;\">\n                <\/div>\n            <\/div>\n\n            <button onclick=\"calculateProjectedScore()\" \n                style=\"width: 100%; background: #0A1325; color: white; font-weight: 600; padding: 1rem; border-radius: 0.5rem; border: none; cursor: pointer; font-size: 1rem;\">\n                See Your New Score\n            <\/button>\n\n            <!-- Projected Score Result -->\n            <div id=\"projectedResult\" style=\"display: none; margin-top: 1.5rem; padding: 1.5rem; background: white; border-radius: 0.5rem; border: 2px solid #0A1325;\">\n                <div style=\"text-align: center;\">\n                    <p style=\"font-size: 0.875rem; color: #8A8A8A; margin-bottom: 0.5rem;\">Your Projected Score<\/p>\n                    <p id=\"projectedScoreText\" style=\"font-size: 3rem; font-weight: bold; color: #16a34a; margin: 0;\">720<\/p>\n                    <p id=\"projectedCategory\" style=\"font-size: 1rem; color: #0A1325; font-weight: 600; margin-top: 0.5rem;\">Good<\/p>\n                    <div style=\"margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #E6E6E6;\">\n                        <p style=\"font-size: 0.875rem; color: #0A1325;\">\n                            <strong id=\"scoreIncrease\">+45<\/strong> point increase by paying off <strong id=\"payoffDisplay\">$3,000<\/strong>\n                        <\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- Disclaimer -->\n        <div style=\"margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #E6E6E6;\">\n            <p style=\"font-size: 0.75rem; color: #8A8A8A; text-align: center; margin: 0;\">\n                This is an educational estimate based on simplified FICO scoring models. Actual credit scores depend on many factors and may vary. For precise score information, check your credit report from the major bureaus.\n            <\/p>\n        <\/div>\n\n    <\/div>\n<\/div>\n\n<script>\n    function calculateCreditScore() {\n        const totalDebt = parseFloat(document.getElementById('totalDebt').value) || 0;\n        const totalLimit = parseFloat(document.getElementById('totalLimit').value) || 1;\n        const onTimePayments = parseInt(document.getElementById('onTimePayments').value) || 0;\n        const newAccounts = parseInt(document.getElementById('newAccounts').value) || 0;\n        const hardInquiries = parseInt(document.getElementById('hardInquiries').value) || 0;\n\n        \/\/ Calculate credit utilization\n        const utilization = (totalDebt \/ totalLimit) * 100;\n\n        \/\/ Base score starts at 300\n        let score = 300;\n\n        \/\/ Payment History (35% of score - max 245 points)\n        const paymentScore = (onTimePayments \/ 24) * 245;\n        score += paymentScore;\n\n        \/\/ Credit Utilization (30% of score - max 210 points)\n        let utilizationScore = 0;\n        if (utilization <= 10) utilizationScore = 210;\n        else if (utilization <= 30) utilizationScore = 180;\n        else if (utilization <= 50) utilizationScore = 120;\n        else if (utilization <= 75) utilizationScore = 60;\n        else utilizationScore = 20;\n        score += utilizationScore;\n\n        \/\/ Length of Credit History (15% - simplified to 105 points baseline)\n        score += 105;\n\n        \/\/ New Credit (10% - max 70 points, penalize for too many new accounts)\n        let newCreditScore = 70 - (newAccounts * 15);\n        if (newCreditScore < 0) newCreditScore = 0;\n        score += newCreditScore;\n\n        \/\/ Credit Mix (10% - simplified to 70 points baseline)\n        score += 70;\n\n        \/\/ Hard Inquiries penalty\n        score -= (hardInquiries * 5);\n\n        \/\/ Cap score at 300-850\n        if (score < 300) score = 300;\n        if (score > 850) score = 850;\n\n        score = Math.round(score);\n\n        updateScoreDisplay(score);\n    }\n\n    function updateScoreDisplay(score) {\n        \/\/ Update score number\n        document.getElementById('scoreText').textContent = score;\n\n        \/\/ Determine category and color\n        let category, color;\n        if (score >= 800) {\n            category = \"Exceptional\";\n            color = \"#16a34a\";\n        } else if (score >= 740) {\n            category = \"Very Good\";\n            color = \"#22c55e\";\n        } else if (score >= 670) {\n            category = \"Good\";\n            color = \"#84cc16\";\n        } else if (score >= 580) {\n            category = \"Fair\";\n            color = \"#eab308\";\n        } else {\n            category = \"Poor\";\n            color = \"#dc2626\";\n        }\n\n        document.getElementById('scoreCategory').textContent = category;\n\n        \/\/ Update arc color and progress\n        const arc = document.getElementById('scoreArc');\n        arc.setAttribute('stroke', color);\n\n        \/\/ Calculate dashoffset (251.2 is full arc length)\n        const percentage = (score - 300) \/ 550; \/\/ 550 is the range (850-300)\n        const offset = 251.2 - (251.2 * percentage);\n        arc.style.strokeDashoffset = offset;\n    }\n\n    function calculateProjectedScore() {\n        const totalDebt = parseFloat(document.getElementById('totalDebt').value) || 0;\n        const payoffAmount = parseFloat(document.getElementById('payoffAmount').value) || 0;\n        const totalLimit = parseFloat(document.getElementById('totalLimit').value) || 1;\n        const onTimePayments = parseInt(document.getElementById('onTimePayments').value) || 0;\n        const newAccounts = parseInt(document.getElementById('newAccounts').value) || 0;\n        const hardInquiries = parseInt(document.getElementById('hardInquiries').value) || 0;\n\n        \/\/ Calculate new debt after payoff\n        const newDebt = Math.max(0, totalDebt - payoffAmount);\n        const newUtilization = (newDebt \/ totalLimit) * 100;\n\n        \/\/ Calculate projected score\n        let projectedScore = 300;\n\n        \/\/ Payment History (same as before)\n        const paymentScore = (onTimePayments \/ 24) * 245;\n        projectedScore += paymentScore;\n\n        \/\/ NEW Credit Utilization\n        let utilizationScore = 0;\n        if (newUtilization <= 10) utilizationScore = 210;\n        else if (newUtilization <= 30) utilizationScore = 180;\n        else if (newUtilization <= 50) utilizationScore = 120;\n        else if (newUtilization <= 75) utilizationScore = 60;\n        else utilizationScore = 20;\n        projectedScore += utilizationScore;\n\n        \/\/ Other factors (same)\n        projectedScore += 105; \/\/ Length\n        let newCreditScore = 70 - (newAccounts * 15);\n        if (newCreditScore < 0) newCreditScore = 0;\n        projectedScore += newCreditScore;\n        projectedScore += 70; \/\/ Mix\n        projectedScore -= (hardInquiries * 5);\n\n        if (projectedScore < 300) projectedScore = 300;\n        if (projectedScore > 850) projectedScore = 850;\n        projectedScore = Math.round(projectedScore);\n\n        \/\/ Get current score for comparison\n        const currentScore = parseInt(document.getElementById('scoreText').textContent);\n        const increase = projectedScore - currentScore;\n\n        \/\/ Determine new category\n        let category;\n        if (projectedScore >= 800) category = \"Exceptional\";\n        else if (projectedScore >= 740) category = \"Very Good\";\n        else if (projectedScore >= 670) category = \"Good\";\n        else if (projectedScore >= 580) category = \"Fair\";\n        else category = \"Poor\";\n\n        \/\/ Display results\n        document.getElementById('projectedScoreText').textContent = projectedScore;\n        document.getElementById('projectedCategory').textContent = category;\n        document.getElementById('scoreIncrease').textContent = (increase >= 0 ? '+' : '') + increase;\n        document.getElementById('payoffDisplay').textContent = '$' + payoffAmount.toLocaleString();\n        document.getElementById('projectedResult').style.display = 'block';\n    }\n\n    \/\/ Initialize on page load\n    calculateCreditScore();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Credit Score Simulator See how paying off debt can improve your credit score 300 Poor Credit Card Debt Total Credit Card Balance $ Total Credit Limit $ Payment History On-Time Payments (Last 24 Months) \/ 24 Account Activity New Accounts (Last 12 Months) Hard Inquiries (Last 12 Months) Debt Payoff Projection How much will you [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3298","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/pages\/3298","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/osescore.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3298"}],"version-history":[{"count":1,"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/pages\/3298\/revisions"}],"predecessor-version":[{"id":3299,"href":"https:\/\/osescore.com\/index.php?rest_route=\/wp\/v2\/pages\/3298\/revisions\/3299"}],"wp:attachment":[{"href":"https:\/\/osescore.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3298"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}