What's the best age to claim Social Security? Drop a single script tag into your site, then use <retirement-calc-ss> as a custom HTML element anywhere on the page.
Part of the retirement calculator family — same engine math, different question. Household mode includes survivor benefit math.
Pick colors that match your site, then copy the CSS snippet at the bottom.
retirement-calc-ss {
--rc-accent: #4f8ec9;
--rc-bg: #ffffff;
--rc-surf: #f7f9fc;
--rc-text: #1a1f2e;
}
Drop this into your HTML:
<script src="https://app.retirementscenario.com/embed/v1/ss.js"></script>
<retirement-calc-ss></retirement-calc-ss>
Or pre-seed values relevant to your audience:
<retirement-calc-ss
plan-type="household"
current-age="62"
fra-benefit="2800"
life-expectancy="92"
spouse-current-age="60"
spouse-fra-benefit="2200"
spouse-life-expectancy="94">
</retirement-calc-ss>
| Attribute | Default | Range |
|---|---|---|
plan-type | single | single or household |
current-age | 60 | 50 – 80 |
fra-benefit | 2500 | 500 – 6000 (your monthly SS benefit at Full Retirement Age — read this from your SSA statement) |
life-expectancy | 90 | 70 – 100 (the longer you live, the more delaying wins) |
spouse-current-age | 58 | 50 – 80 (household only) |
spouse-fra-benefit | 1800 | 500 – 6000 (household only — your spouse's SSA-statement number) |
spouse-life-expectancy | 92 | 70 – 100 (household only) |
refsrc | (none) | partner attribution tag |
Honest scope: Assumes Full Retirement Age 67 (born 1960+). Spousal 50% benefit (non-working spouse) not modeled — assumes both spouses have own earning records. SS taxation not included. Lifetime SS in today's dollars. Survivor benefit math embedded for household — when first spouse dies, survivor keeps the larger of own benefit or deceased's adjusted benefit.
Override CSS custom properties on the host:
retirement-calc-ss {
--rc-accent: #ff6b35; /* primary color */
--rc-bg: #ffffff; /* card background */
--rc-surf: #f7f9fc; /* sub-surface (result area) */
--rc-text: #1a1f2e;
--rc-muted: #6a7280;
--rc-border: rgba(20,30,50,0.10);
--rc-radius: 12px;
}
The element emits two custom events you can listen to:
document.querySelector('retirement-calc-ss')
.addEventListener('rc-calculated', (e) => {
console.log('Optimal strategy:', e.detail.optimalStrategy);
console.log('All strategies:', e.detail.strategies);
console.log('Breakeven age (single only):', e.detail.breakeven);
});
document.querySelector('retirement-calc-ss')
.addEventListener('rc-cta-clicked', (e) => {
console.log('User clicked CTA to:', e.detail.url);
});