Hero V02

Author: Colorlib
Released: September 2026
License: CC BY 3.0
A centred landing-page hero for a remote-work video product, set on a soft gradient mesh made of four blurred shapes that drift slowly. It has a rating pill, a balanced multi-line headline, two calls to action and a logo cloud of six invented company wordmarks drawn with inline SVG. The glass top bar turns into a round menu button on phones, and the mesh stops moving when reduced motion is requested.
It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 204 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.
- Animated CSS gradient mesh with a static reduced-motion fallback
- Glass navigation bar with backdrop blur
- Logo cloud of invented wordmarks in inline SVG
- Balanced headline wrapping with text-wrap
- Accessible mobile menu with Esc to close

