Obsidian studio navbar and video player UI

Obsidian studio navbar and video player UI, dark-mode, minimal, dark

Preview image. Unlock full-res

A dark agency site header for 'OBSIDIAN' over a blurred warm gradient, with a monospace video-player bar, camera-style corner crops, and a Paris/New York/Dubai office row.

Summary

A dark agency website frame: a frosted navbar branded "OBSIDIAN" with Works / About / Contact, a monospace video-player control bar, and a three-city office row, all floated over a soft warm-to-dark gradient with camera-style crop marks at the corners.

Visual description

The background is a moody, blurred gradient drifting from cool dark green at top to warm amber and near-black, like an out-of-focus film still. Thin white right-angle crop marks pin the four corners, framing the page like a viewfinder. A horizontal frosted-glass navbar near the top carries the bold all-caps "OBSIDIAN" logotype on the left and three monospace caps links, WORKS, ABOUT, CONTACT, on the right. Lower down sit two stacked translucent bars: an "INFO & CREDITS" label beside a ghosted "LAUCH CAMPAIGN" tab, then a player row with a square pause glyph, a scrub track, a "00:54" timecode, and "SOUND ON" with ON in green. Below the bars, three columns headed PARIS, NEW YORK, DUBAI each show a 04:00:34 timecode and the same monospace street address.

Key takeaway

The viewfinder crop marks plus a monospace timecode-and-sound player bar instantly frame the site as a film or motion studio without any moving image. Frosted translucent bars over a blurred warm gradient keep navigation legible while the background stays atmospheric.

Reuse notes

A strong header pattern for a motion, film, or creative studio portfolio that leads with video. The city-timecode row is a tidy way to show global offices. Caveat: the player UI implies a background video, so it only reads right when an actual reel or moody loop sits behind it.

More like this