Skip to content
PolyFish CSS

Three footers in 4 KB

A column footer for marketing pages, a one-line slim variant for docs and app shells, and an accent variant that recolours itself completely. The real one is at the bottom of this page.

.pf-footer--slim

One line, for interior pages

Copyright, a couple of legal links and a back-to-top. Use it anywhere a full column footer would be more navigation than the page itself.

.pf-footer--accent

The accent variant

Every child recolours: headings, link columns, the social row, the legal bar and the back-to-top marker. One class, no overrides on your side.

Anatomy

What the column footer is made of

.pf-footer__brand

Logo lockup, one sentence of positioning, and optionally an inline signup form that reuses the Content field styles.

.pf-footer__col

A heading and a link list. Add as many as you need — the grid collapses them in one step rather than four.

.pf-footer__bottom

The legal bar: copyright, inline legal links and the back-to-top anchor, separated by a hairline.

The signup form needs Content

.pf-input and .pf-label live in the Content module. A footer with a signup field needs both files; a footer with only links needs Core and Footers.