Diagonal stripe sustainability hero

Summary

A sustainability-focused web hero pairing a diagonal lime-green stripe pattern with dark copy, a bright CTA, and rural landscape photography.

Visual description

The background is dominated by a full-screen diagonal stripe pattern in shades of bright lime and forest green, angled left-to-right at roughly 45 degrees. Overlaid on the left is a dark olive-green panel containing a navigation bar at the top (minimal text links) and stacked headline text reading "Making Sustainability* Happen" in white sans-serif (the asterisk points to an illustration). Below that is a small bright lime-green button or accent. To the right of the dark panel sits a landscape photograph showing a vast golden-brown agricultural field under blue sky, its warm tones contrasting the cool green surround. The composition balances the graphic pattern with photographic realism, using the diagonal as a visual divider.

Key takeaway

The diagonal stripe pattern as a background element that fills negative space without competing for attention. The color combination (lime and forest green on the pattern, set against a warm agricultural landscape) naturally reinforces the sustainability message. The dark panel anchors headline and navigation, creating a safe zone for text legibility on top of a busy pattern. Pairing a geometric graphic motif with photography adds depth and credibility.

Reuse notes

Ideal for environmental, energy, or agricultural company landing pages. The diagonal pattern energizes the design without being overwhelming. Scale the stripes in proportion to viewport size (thinner on mobile, bolder on desktop). Works best with landscape or agricultural photography; avoid portraits or complex imagery in the photo area. The green palette is inherent to the message; if not selling sustainability, choose a different palette shape.