Inside the Osmo website design
Osmo is an AI website built with Webflow and GSAP. Its pages are built from hero, features, footer, founder, stats, team, feature grid, process, CTA, testimonials, and FAQ sections, shown here in full-page captures and a scroll recording. Palette: #FFC0A0, #E0FFC0, #FF8040.
Osmo, the olfactory technology company combining AI & industry-leading perfumery expertise to reimagine fragrance development, creation & end-to-end fragrance manufacturing. Its visual style is editorial, soft, and minimal, with navigation bar, hero with background imagery, and primary button among its components.
Why we picked it
Misty forest photography and thin light text set a sensory, almost scentlike mood before the page shifts to warm coral and cream panels for the product mechanics. Orange data cards, dashboards, and quote blocks give the AI claims something concrete to point to, building trust as the page moves from feeling to proof.
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
- Footer: grouped navigation with clear column headings
- Founder: a genuine portrait rather than stock imagery
Questions designers ask
What is the Osmo website built with?
The Osmo website is built with Webflow and GSAP, detected when the page was captured.
What colours does the Osmo website use?
The captured palette includes #FFC0A0, #E0FFC0, and #FF8040.
What sections does the Osmo website have?
The Osmo website includes hero, features, footer, founder, stats, team, feature grid, process, CTA, testimonials, and FAQ sections. Each one opens on its own page, so you can compare it with the same section on other websites.
Can I use Osmo's design for my own project?
Use it as a reference for structure, hierarchy, and style rather than something to copy. The DESIGN.md download summarises Osmo's typography, colours, and components for your team or an AI tool.
