Realtime logo treatments

Creative shaders for the Fontana mark.

A small WebGL gallery exploring how the Fontana logo behaves under water, glass, chrome, holographic light, caustics, aurora noise and signal-grid distortions — designed to stay quick and touch-friendly on mobile.

Open the gallery Implementation notes

Live WebGL canvasShader-driven logo mask: the material is inside the mark, not floating behind it.

Seven moods, one mark.

Each card uses the same Fontana logo but changes the material language: fluid, optical, metallic, spectral, refracted, operational, and atmospheric.

WaterRipples

Liquidity Engine

Blue-green wave interference bends light around the mark like a calm data pool under pressure.

GlassPrism

Prismatic Control

Soft refraction, edge glints and chromatic split: a governed lens over moving data.

ChromeLiquid

Liquid Audit Metal

Mercury bands and high-contrast highlights for an engineered, high-assurance finish.

HologramScanline

Evidence Hologram

Scanlines, diffraction and drifting spectrum bands give the mark a live instrument-panel feel.

CausticsLight field

Reconciliation Caustics

Converging light nets suggest many messy paths resolving into one controlled surface.

AuroraDepth

Northern Ledger

Layered ribbons drift behind the logo like a quiet night-sky view of financial operations.

GridSignal

Deterministic Signal

A crisp operational grid with pulsing nodes — the least magical, most Fontana one.

Built for mobile first

The gallery caps device pixel ratio, pauses work when cards leave the viewport, and collapses into a single-column touch layout on small screens.

No external media needed

The environment maps are procedural, and the verified Fontana logo is sampled as a WebGL texture mask so each material lives inside the mark itself.