# Site footer > An inverted footer where the site name, set at display size, is the structure: three dense link columns hang to its line instead of sitting under a floating logo. A contrast ground carrying base type. States no colour and no font of its own. Canonical: https://patternpaste.com/pattern/site-footer.html Section: Footer Access: Free, and free to keep. Needs: Requires a block theme on WordPress 7.0 to 7.1. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type. Blocks: button, buttons, column, columns, group, heading, paragraph, separator Keywords: footer, wordmark, links, columns, sitemap Promise: Identical markup in every theme. --- ## The signature moment: the wordmark is the structure **The site name is set at display size and anchored to the bottom-left corner, and every link column hangs down to its line rather than sitting under a logo that floats above them.** The usual footer is a small mark on top of four equal columns; here the mark is the largest thing in the section, its box cropped tight to its capitals by a `0.82` line-height, and the columns are bottom-aligned so their last link lands on the same line the wordmark sits on. The tops of the columns are left ragged on purpose: the alignment that matters is at the bottom, which is where the wordmark is. That is also why the columns are uneven. The wordmark column takes 34% and the three link columns take 22% each, so the section reads as one heavy left mass against a dense, quiet right one rather than as four equal boxes. ## What it inherits from your theme - **The typeface.** The pattern states no font family anywhere. The wordmark is set in your theme's face, which is the point: it is your name, not ours. - **Your colours.** The ground asks for `contrast` and everything on it asks for `base`, the two slugs every stock block theme defines. If a theme defines neither, the footer falls back to black and white and still inverts. - **Your spacing scale.** The band's padding, the gap between columns and the space above the hairline are spacing presets, so a theme with a generous scale gets a taller footer without you editing anything. - **Your link and button styling.** Every link is a core button with its own colours cleared back to the band's, so it takes the shape of your theme's button element styles while reading as plain text. ## What it decides for itself - **The inversion.** This and `cta-band` are the only two patterns in the catalogue that flip ground and type. A footer that inverts closes a page whatever the rest of it looks like. - **Full bleed with its own measure.** The band spans the viewport and holds its content to 1240px, so it is a footer rather than another column of text. - **The bottom alignment.** The columns row is bottom-aligned, which is the signature and not a preference. Set it back to top and it becomes an ordinary footer. - **The link boxes.** Each link carries a full rem of padding above and below and none at either side. The padding is what makes a link comfortably tappable on a phone, at a real box height rather than the height of a line of text; the zero side padding is what keeps every link flush with its column heading. - **The hairline.** The rule above the fine print is `currentColor` and set wide, so it follows the type wherever your theme puts it and cannot resolve to nothing. ## What to change first 1. **The wordmark.** Replace "Hallmere" with your site name. It is a heading, so it takes the type ramp with it: a name much longer than about ten characters wants the `clamp()` maximum stepping down from `4rem`, because the wordmark must not outgrow its column. 2. **The three column headings and their links.** They ship without URLs. The labels are deliberately eight characters or more; keep them there, because a very short label makes a small tap target on a phone. 3. **The eyebrow.** "Design studio, Leeds" is the one line above the wordmark. Make it your location, your discipline, or delete it. 4. **The fine print.** The copyright line and the three legal links sit under the hairline. Add a fourth link and the row wraps rather than spreading. 5. **The footer's height.** The band's top padding is spacing preset 80 and its bottom is 60. Step both down one rung if your theme's scale is already generous. ## Notes - Core blocks only: group, columns, column, heading, paragraph, buttons, button, separator. No plugin, nothing to keep updated. - Every colour is a fallback chain ending on a colour WordPress itself guarantees, so nothing in the footer can resolve to nothing. - No promise axis is declared: colour, type and motion are all the default, so this pattern inherits your palette and your typeface and carries no CSS of its own. - Below 782px the columns stack, so the footer becomes one long list with the wordmark at the top. That is core's stacking, not ours, and it is why the link boxes are sized for a thumb rather than for a mouse.