Inside the Pancake website design
Pancake is a marketing website built with custom code and Next.js. Its pages are built from hero, features, pricing, editorial, and footer sections, shown here in full-page captures and a scroll recording. Typography: Aeonik Condensed (display text and headings) and Geist Sans (body text). Colours: background #FBF6F1, text #2C002A, accent #8D43FD, surface #FFFFFF.
Pancake gives your agent the brain, the data and the tools to run your go-to-market. Its visual style is playful, colourful, and bold, with hero, input field, and feature card among its components.
Why we picked it
A cheerful rainbow arcs over a cream page while a stacked chat window shows the actual product prompt, grounding a playful mood in a real tool. Numbered steps, a node diagram, and bold color-block sections pace the long page into easy stages, and bright sky and sunset panels mark the shift from product to proof and pricing.
What to look for
- Hero: a specific headline instead of a generic slogan
- Features: benefits framed around what the user gets, not internal capability names
- Pricing: two to four plans with a highlighted recommendation
- Editorial: expressive typography with comfortable reading measure
Questions designers ask
What fonts does Pancake use?
Pancake uses Aeonik Condensed for display text and headings, and Geist Sans for body text, measured from the captured page's CSS.
What is the Pancake website built with?
The Pancake website is built with custom code and Next.js, detected when the page was captured.
What colours does the Pancake website use?
Measured from the captured page's CSS, the Pancake website uses #FBF6F1 for the background, #2C002A for text, #8D43FD as an accent, and #FFFFFF for surfaces.
What sections does the Pancake website have?
The Pancake website includes hero, features, pricing, editorial, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.