ASCII Wordmark Footer
A footer whose name is set in live ASCII: the wordmark drawn glyph by glyph in signal, printed in cell by cell as the footer rises, crossed by a slow light, and turned to paper under the pointer.
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.
Props
"use client";
import { createContext, useContext, useEffect, useRef, useState, useSyncExternalStore } from "react";
import type { CSSProperties, RefObject } from "react";
/**
* AsciiWordmarkFooter — a footer whose name is set in live ASCII.
*
* The brand is drawn in the display face and set glyph by glyph in the mono
* face by the kit's WebGL2 stage, matched to the shape of the letters. It
* prints in cell by cell as the footer rises into view; a slow band of light
* crosses it every 36s, and under the pointer the glyphs turn from signal to
* paper and re-select denser.
*
* Part of the Dither & ASCII kit: one ink, paper #f3f0e6, on a warm black
* ground #0b0b0d, with vermillion #ff4f2b as a second ink inside the
* pictures and for a live state. Cells snap to whole device pixels;
* scenes dither in linear light, photographs on a gentler curve. Funnel Display through
// ---------------------------------------------------------------
// Full source available with a viberdy Pro subscription.
// https://viberdy.dev/pricing
// ---------------------------------------------------------------
}About this section
A footer that signs off in type made of type. The brand is drawn in the display face into a texture and set, glyph by glyph, in the page's mono face, each cell matched to the shape of the letters, so stems become bars, bowls become brackets and diagonals become slashes; the whole name is inked in signal. As the footer rises into view the glyphs print in cell by cell in blue-noise order, a slow band of light crosses the name once every 36 seconds, and under the pointer the glyphs turn from signal to paper and re-select denser, as if the name were lit from where you point. Above it, the brand line and three link columns; below, the legal line. It reads the page's scroll, or the scroll root the kit's site provides inside a frame.
Curator’s note
The Dither & ASCII kit's footer (slot 9), cut from dither-ascii-site. Pro: it runs the kit's WebGL2 stage (a word drawn into a texture, shape-matched ASCII, a blue-noise print-in), so the dissolve primitive is the borderline entry that stays Free.
Pairs well with
Matched on shared tags and category — the entries most likely to be used alongside this one.
Mirror Pool Footer
sectionsA footer whose giant chrome wordmark stands on the waterline of a dark pool that mirrors it: a real wave simulation rings under the pointer and takes a drop every ten seconds, bending the reflection as it ripples.
Aurora Rise Footer
sectionsA footer where the lights come out as the page ends: scroll raises the aurora from behind the city's roofline, widens it into violet and rose and lights more windows under a large lit wordmark.
Pedestal Footer
sectionsA 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.