Calculators every visitor can use

Each field has a visible label and help text explaining what to enter. The calculator is meant to be operable by keyboard, and results are shown as text, not images, so assistive technology can read them. A plain-language definitions block explains terms. Visitors can switch between English and Spanish, and light, dark or auto mode follows preferences.

• Labels and help text on every input, taken from the calculator's own field definitions.
• Keyboard use — fields, buttons and the lead form are intended to be reachable and usable without a mouse.
• Results as text that updates as the visitor types, rather than a chart-only answer.
• Definitions in plain language, shown collapsed, expanded or as a tab.
• Light, dark and auto mode, so the calculator can follow the visitor's device setting.
• English and Spanish interface, switchable by the visitor.

Your palette, custom colors, fonts, custom CSS and theme all change how readable and usable the calculator is. A brand color that looks right can fail contrast for button text, and a decorative theme can add motion some visitors find hard to use. Check contrast and keyboard focus after every change to these settings.

Effect-heavy themes such as particles, aurora and depth-3d are decorative. If your audience includes many older visitors — common for Medicare-age, long-term care and annuity pages — a calmer theme like ledger, minimal or editorial, with a comfortable font size, is the safer choice. Check how your chosen theme behaves with your operating system's reduced-motion setting switched on.

Custom CSS can hide focus outlines or shrink text without you noticing. Keep focus indicators visible and avoid fixed font sizes below the default.

Test on the published page, not the editor. Complete the calculator and lead form using only the keyboard; check that focus is always visible. Use a screen reader to hear labels and results. Zoom the page to 200 percent, try light and dark mode, and turn on reduced motion. Repeat after changing theme or palette.

• Tab through every field, the definitions, the language switch and the lead form; nothing should trap focus.
• Listen with your device's built-in screen reader: each field's label and the result should be announced clearly.
• Check text and button contrast against WCAG 2.2 AA with your actual palette.
• Zoom to 200 percent and view on a narrow phone screen; nothing should be cut off.
• Switch to Spanish and confirm your consent and disclaimer text reads correctly.
• Turn on reduced motion and check the theme you chose.

Your agency is responsible for its website as a whole, including any tool embedded on it. We design the calculators toward WCAG 2.2 AA and want to hear about any barrier inside them, but we can't control your page layout, colors or custom CSS. Test the combination and tell us about anything inside the calculator that fails.

This page describes design goals, not a certification or a legal opinion. Our accessibility statement covers this website, and you can report a barrier through the contact page.