Skip to content

Ember Rest Footer

A footer where the day ends: as it rises into view the room above the links, rendered live, loses its daylight, the lamp dims to an ember, and the whole footer goes from paper to night under a closing line.

ProModern Minimalminimaleditorial

This is a viberdy Pro component

The live preview, the props panel and the write-up are open to everyone. The full source, the AI prompt and CLI install are part of Pro.

Preview

Scroll to the end of the day

Goodnight.

HaldenLight that wakes you.
© 2027 Halden. A fictional company.4200 K · 96% · 19:30

Props

0.7
No runtime dependencies
"use client";

import { createContext, useContext, useEffect, useRef, useState, useSyncExternalStore } from "react";
import type { CSSProperties, RefObject } from "react";

/**
 * EmberRestFooter — a footer where the day ends.
 *
 * As the footer rises into view, dusk follows the scroll with no easing: the
 * room above the links (rendered live) loses its daylight, the lamp dims to
 * an ember at 1,800 K, and the whole footer goes from paper to night, its
 * type turning from ink to paper as it passes, under a closing line.
 *
 * Part of the Modern Minimal kit: a paper-white room (#f5f5f2, surfaces
 * #ffffff, ink #141412) and one light, dawn #ffa64d, only ever as light.
 * Two-layer shadows from one light above; scroll binds values directly,
 * with no easing. Inter Tight through var(--font-inter-tight) for display
 * over Geist. Respects prefers-reduced-motion. No dependencies beyond React.

  // ---------------------------------------------------------------
  // Full source available with a viberdy Pro subscription.
  // https://viberdy.dev/pricing
  // ---------------------------------------------------------------
}
Notes

About this section

A footer that closes the page the way the day closes. As the footer rises into view, dusk follows the scroll with no easing: the room above the links, rendered live, loses its daylight, the lamp dims from white to an ember at 1,800 K, and the whole footer goes from paper to night with it, its type turning from ink to paper as the room passes mid-grey. A closing line is set large over the room; the brand, the link columns and the legal line sit beneath. A page built with the kit's hero starts at night and ends at night.

Curator’s note

The Modern Minimal kit's footer (slot 9), cut from modern-minimal-site. Pro: it runs the kit's WebGL2 room, so the scroll-scrubbed reveal primitive is the borderline entry that stays Free.

Related

Pairs well with

Matched on shared tags and category — the entries most likely to be used alongside this one.

NewPro

A footer where the product comes to rest: as it scrolls into view the dial floats down onto a mirror floor, its parts closing up as it lands, over a large wordmark lit from the object's key light.

footerwebgl3d
Featured
NewPro

A first screen that is night until you scroll it into morning: the hero pins and the scroll is the dawn, bound with no easing, as a live-rendered room goes from dark to paper white and the lamp from ember to daylight.

heroscrollscrub
NewPro

The sunrise laid out on a timeline and scrubbed by the scroll: the section pins, 05:30 to 07:00 runs with the scroll, the lamp rendered live rises along its curve, and the time, colour, output and phase follow.

sectionscrollscrub