Flowroos arranges flowers for weddings, private dinners, and product launches in Turku. The brief was a single hero page that feels as considered as the arrangements themselves โ soft, editorial, and confident enough to land event commissions.
I built the hero around a pressed-flower collage: an airy white umbel, a soft violet stem, a pink petal cluster, and a pale pansy bloom. Each flower is a separate PNG layered with CSS absolute positioning, so the composition can shift and scale across breakpoints without losing its editorial feel.
Typography pairs Bodoni Moda for the headline and wordmark with Josefin Sans for the nav and body copy. The palette is warm petal tones in OKLCH โ no pure grays, no pure whites โ tinted toward the floral hue so the page reads as one material.
The responsive behavior uses three layout stages instead of a binary desktop/mobile split. On wider screens, the wordmark, copy, and bouquet share a composed three-column grid. Around 900px the layout drops to a compact two-column arrangement with the wordmark anchored top-left and the bouquet right-aligned. On phones, the hero becomes a true single-column stack: copy first, bouquet below, caption attached.
Built with Astro, scoped CSS, and local flower assets processed through Astro's native image pipeline.