Footer prompt
With a planA premium editorial footer: a giant gradient wordmark that fills the width and glows from below, a glass newsletter card that works without JavaScript, four link columns, an email call to action and a legal row.
A picture of the design. The live, interactive preview, the full prompt and the code unlock with a Dapols plan. See the plans.
Want this on your own site? Pick it for your plan.
Everything on this page except these four tabs is free to read. The tabs unlock with a paid Dapols plan.
Mainmast is included with every Dapols plan
Free visitors get the free prompts. Any Dapols plan, the one-time setup or the monthly subscription, unlocks every prompt.
Unlocking this prompt gives you:
Already have a paid plan?
Not on a plan yet?
The preview, description and FAQ on this page are free. A plan unlocks this prompt and every other one in the library.
See the plansWant to try one now? Browse the free prompts.
Mainmast is a site footer that ends the page with a statement. The brand name is set in a heavy grotesk, scaled with container query units so it runs from one edge of the screen to the other at every width from a phone to a wide desktop. Every letter is fully visible and filled with a luminous gradient, cream into mint in the dark theme and ink into verdigris in the light one, with a soft glow rising behind it and a fine film grain over the whole scene. Above it, a frosted glass card holds a serif headline that invites people to join a monthly newsletter; the form is labelled, validated by the browser and works as a plain mail or post form when JavaScript is off, with an inline thank-you message when it is on. Four short link columns, a large italic email link and a quiet legal row keep the practical parts tidy. A single verdigris and mint accent family carries the glow, hover, focus and the italic words. Hovering a letter lifts it and lights it up, and that effect is switched off for visitors who ask for reduced motion. It suits studios, agencies, publications and any brand with a short, strong name.
Pairs well with the Atelier, Canvas and Ledger Looks in the Dapols website studio. See website examples.
Put the word in a box that is a size container, set the font size in container query units with a clamp, and spread the letters with flex and space-between. The size follows the box, and the spacing absorbs small differences between fonts, so the first and last letters always touch the edges.
Yes. It is an ordinary form with required email validation and an action that can be a mail link or your own endpoint. About eight lines of script add the inline thank-you message when JavaScript is available.
Yes, with five to seven letters it works best. The default size is tuned for six wide capitals, so use about 16 for seven letters and about 22 for five, and the word will still reach both edges.
HeroWith a plan
A bold editorial hero built around a luminous self-drawing SVG contour map: dozens of flowing lines trace themselves in over a soft sun glow, glowing routes ignite, nodes pulse, and hovering lights the nearest line.
Call to actionWith a plan
A closing call to action set like a film-title poster: giant SVG type with a flowing red gradient and a hard offset shadow, a timeline ruler with a red playhead, a rotating circular text badge, crossing marquee bands, a liquid ripple that follows the pointer and a magnetic button.
3D and Three.jsWith a plan
A cinematic full-viewport hero over 52,000 GPU particles that breathe between a ribbon and a sphere, with depth of field, bokeh, additive glow, a hot core thread, film grain and a lens reticle. Three.js, dark and light.
Need a whole site, not one section? Pick the designs you like, choose your colors and fonts, and Dapols builds the website for you as part of your plan. Answer a few questions about your business to get started.
