Solarpunk Animated HTML website template

The sample page

Pip. Rooftop solar co-op in Adelaide.

The idea

The page’s panels become rooftop solar pergolas, and a pumpkin vine climbs their edges in the golden morning light, safe from the January heat.

What to try

Scroll to run a 50-day season: the vine climbs the edges, the blossoms open and the first pumpkin appears.

Made for

Clean energy, nonprofits and sustainable brands

Palette

• #F7F3E3
• #2F6B3B
• #7FB85E
• #F2C14E
• #B87333
• #1E3B47

Typefaces

Fraunces + Lexend

Cultural notes

• No greenwashing: no made-up impact numbers; the only figure is an estimate with its formula shown.
• Real technology and craft: 550 W panels, a pergola, timber planters, a cargo trike and people from the neighbourhood.
• Plants generated in code, with no landscapes from animated films and no Aboriginal art or symbols.

The HTML

What you download

• A single index.html file with nothing to install: open it, swap in your brand and copy, and upload it to your hosting.
• In English and Spanish, tested on desktop and mobile.
• Instructions for changing copy, colors, language and prices, plus its license.