BioGenix is built for biotech companies that need to communicate scientific credibility while feeling modern and alive. The design uses fluid SVG turbulence backgrounds (zero JS), sticky scroll-driven panel transitions, and word-by-word text reveals for maximum impact.
Pages
- 12 pages: Home, Platform, Company, Newsroom (list + detail), Careers, Contact, Privacy, Terms, 404
- Newsroom system with article detail pages
- Platform page with sticky scroll storytelling
Design & Animation
- Dual-pill navigation (floating logo pill + separate CTA pill)
- Fluid SVG turbulence backgrounds (zero JS, CSS-only)
- Sticky scroll panel swap with line-by-line text highlight
- Word-by-word text reveal on scroll
- Nav hide-on-scroll-down, reveal-on-scroll-up
- Dual pill CTA with segmented liquid fill hover
- Full prefers-reduced-motion support
Components
- Button (dark/light variants)
- Scroll-driven sticky panel system
- Fluid background generator (SVG feTurbulence)
- Word reveal text animation
- Back-to-top floating button