Keystead

Keystead is a website template for independent mortgage brokers and small lending teams. It opens with what a borrower came to find out: what the loan would cost each month. The calculator sits in the hero and updates as they move the sliders, with no form in the way.

What is included

• Live monthly payment calculator in the hero, with home price, down payment, interest rate and 15, 20 or 30 year terms. It is a code component, so default values, taxes and insurance and its colors are edited in the properties panel

• Three dimensional blueprint street behind the hero, built in three.js: wireframe houses that drift, tilt with the pointer and sink as the page scrolls. It loads on the first gesture, so the page paints first, and it switches itself off for visitors who prefer reduced motion. Line color, opacity, house count and drift are properties

• Motion with a purpose: sections fade up as they enter, cards and buttons lift on hover, photos scroll slower than their copy

• One long-scroll home page with rate board, loan programs, broker versus bank comparison, process, document checklist, about, FAQ and booking sections

• Sample rate board clearly labeled as sample figures, ready for your own numbers

• Footer ready for your NMLS number and Equal Housing notice

• Call and email actions you can point at your own phone, inbox or scheduler

• Responsive layouts for desktop, tablet and phone

• Named text styles and a small color palette, so changing the brand takes minutes

• Headings in Familjen Grotesk with Instrument Sans for body text and IBM Plex Mono for figures

Who it is for

Licensed mortgage brokers, loan officers and small brokerages who want a site that answers the payment question first and turns that visit into a call.

All copy, rates, names and photos are placeholders. Replace them with your own details, license number and disclosures, and check the wording with your compliance contact before publishing. The calculator gives an estimate, not a loan offer.