Kestrel: a SaaS marketing site the content team can run

Most fintech marketing sites are mostly lists: integrations, customer stories, articles. If each entry is a hand-built page, the content team files a ticket every time something ships. If each one is a CMS item, they open the Editor, fill in six fields and publish. Kestrel is an invented spend-control app for agencies that bill by the hour, and I built its site to test that second case.

15 static pages (home, product, pricing, sign in, legal) and 24 CMS pages from three collections: 18 integrations, 3 customer stories and 3 articles. Each collection has its own template page. Visitors can search integrations and filter them by category; typing a name while a category chip is on narrows the list inside that category.

A bone-coloured page (#F5F4EF), near-black text and one rust orange (#E8541E) for what you can click or should notice. Inter Tight for headlines and interface, one accent phrase per heading in Newsreader italic, JetBrains Mono for labels and receipts. The dashboard in the hero and the product tiles are live Webflow elements, not screenshots, so they resize with the page.

Sections fade up 24 px on scroll, section headings reveal line by line, the main call-to-action button leans toward the cursor, and FAQ answers open with a height animation that works from the keyboard. Reveals, split-line headings, the magnetic button and the accordions are Webflow Interactions. With reduced motion set in the system, the reveals jump straight to their finished state.

I checked the live site in headless Chrome at 1440 and 375 px: 216 automated checks passed, 559 links crawled and all resolved, and no page scrolls sideways. That testing caught one real bug. On a phone, the second and third blog cards weren't done animating by the time they scrolled into view, so each card got its own trigger instead of the grid sharing one.

The plan I built this on doesn't allow site-wide custom code, so the category filter, the pricing toggle, the mobile menu and the FAQ state live in Code Embeds on each page. They work and they're fast, but an editor can't change them in the Designer. Built again, I'd use native Webflow parts instead: Tabs for the toggles and filters, a Navbar for the menu, Interactions for the FAQ.

The site is live. Filter the integrations, open a customer story, toggle the pricing. The full write-up with design tokens is at https://day-portfolio.webflow.io/case-study. Kestrel is a fictional company; every figure on the site is invented.