Inside the Bloom website design
Bloom is an AI website built with Framer. Its pages are built from hero, features, process, feature card, feature grid, CTA, and footer sections, shown here in full-page captures and a scroll recording. Typography: Libre Baskerville (display text and headings) and DM Sans (body text). Colours: background #F0E9ED, text #261116, surface #DECCD1.
Bloom brings visibility, contextual risk assessment, precise enforcement, and one-click remediation to endpoint security in the AI era. Its visual style is editorial, illustrative, and soft, with navigation bar, hero, and outline button among its components.
Why we picked it
A blush pink palette and a 3D paper flower soften a cybersecurity pitch, while serif headlines and generous whitespace keep the risk messaging calm rather than alarming. Dark maroon panels and a tangled thorn illustration break up the long scroll, and repeated app screenshots in matching rounded cards make the product features easy to compare at a glance.
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
- Process: three to five numbered steps
- Feature Card: one idea per card
Questions designers ask
What fonts does Bloom use?
Bloom uses Libre Baskerville for display text and headings, and DM Sans for body text, measured from the captured page's CSS.
What is the Bloom website built with?
The Bloom website is built with Framer, detected when the page was captured.
What colours does the Bloom website use?
Measured from the captured page's CSS, the Bloom website uses #F0E9ED for the background, #261116 for text, and #DECCD1 for surfaces.
What sections does the Bloom website have?
The Bloom website includes hero, features, process, feature card, feature grid, CTA, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.
