Desktop · 1280px · shown at 0% · edit the text, images and colours in the panel
Big Wordmark Footer — Free Website Section Template
Footer · v1.0.0 · Updated 2026-10-20 · Responsive · GSAP animation · HTML, React & Vue
What's included
Features
About this section
Big Wordmark Footer — Free Giant Text Footer Template
Big Wordmark Footer ends your site with a statement. At the top, a closing call to action ("Have a project in mind? Let's talk.") with a button and your email; in the middle, a row of links and round social icons; and at the bottom, your brand name set as a giant wordmark across the full width of the page, fading softly toward the bottom.
A reveal to remember
The wordmark is animated with GSAP SplitText: as the footer scrolls into view it rises in word by word, line by line, letter by letter or with a blur, depending on the text effect you pick in the Animation panel. It's also hidden from screen readers (it repeats your brand name), so it never gets in the way.
Sized to fit
The wordmark scales with the width of the section using container query units, so it fills the footer on any screen without overflowing. Short names of up to about ten letters work best.
Dark and bold
It ships in near-black with an orange accent, a favourite for studios and agencies, and every colour comes from the shared theme. Write links one per line as Label | URL, add social icons for Instagram, Dribbble, LinkedIn and more, and set the copyright and legal links.
Export it
Download HTML, a ZIP, React or Vue, or fork into My Code. For a conventional sitemap footer, see the Multi-Column Footer.
Why use it
Why Use the Big Wordmark Footer
How it’s different
How It’s Different From Other Free Section Templates
Step by step
How to Use
- 1Edit the contentFill in the call to action, links, social links and wordmark & copyright in the panel. Switch the social links on or off. Wrap words in *asterisks* to colour them.
- 2Add your imagesUpload your own images (resized in your browser and kept on your device) or paste a hosted image URL.
- 3Match your brandPick a colour preset or exact colours, choose heading and body fonts from Google Fonts or your own uploaded font, set the corner radius and width, or apply your brand kit.
- 4Animate and previewChoose a GSAP entrance effect and speed, press Play animation, and check the section on desktop, tablet and mobile.
- 5Save and exportSave it to My designs, then export a single HTML file, a ZIP with your images, a React or Vue component, or fork it into My Code.
Real-world uses
Common Use Cases
Got questions?
Frequently Asked Questions
It scales with the width of the section (about 15% of it per character height) so it fills the width without overflowing. Shorter names, up to about ten letters, look best.
With GSAP SplitText: it is marked for the headline text effect, so it rises in by words, lines or letters, or blurs in, when the footer scrolls into view. Pick the effect in the Animation panel.
No. It is decorative and hidden with aria-hidden, because it repeats the brand name that is already in the page.
Yes. Pick a light colour preset or your brand kit; the wordmark uses the text colour with a fade, so it works on light backgrounds too.
It saves an editable copy of your Big Wordmark Footer in My Code, the UI Snippets code editor: the section markup goes in the HTML panel, its CSS (theme variables, base styles and layout) in the CSS panel, and the GSAP library is added as a CDN link, so you can keep refining the code and save your own versions.
Yes. It is free for personal and commercial websites, with no sign-up, no watermark and no attribution required. Everything runs in your browser and your edits are saved locally.