Brivon — Modern Photography Studio HTML Template

Brivon is a free, production-ready HTML template for modern commercial photography studios, editorial photographers, documentary teams, and visual-arts producers — the kind of small studio whose marketing surface should read as confident, slow and editorial rather than agency-glossy or portfolio-bland. The visual direction is deliberately editorial-brutalist — closer to a contemporary photo studio's monograph or a Cereal-magazine print masthead than to the cream-warm hospitality templates that dominate this category — and the palette is the cleanest break from html.design's catalogue to date: a deep charcoal ground at #0A0A0C, paper-ivory text at #F4F4F0, and a single electric-lime accent at #D4FF3D used only on tags, hover states, and the closing CTA. Boldonse leads the display, Inter Tight holds the body, and Geist Mono carries the captions and tabular numbers.

The home page leads with a typographic hero — "We photograph the work, not the brief." — positioning Brivon as a small commercial studio between Brooklyn and Berlin, founded in October 2014, eight people on staff. Below the hero, an asymmetric editorial grid carries a four-stat strip, seven selected-work tiles in mixed sizes, a reverse-tile chapter on the studio's working principles with a pull quote, a seven-card capability bento, two split-image chapters on process and rooms, a press strip with six publications, a three-card journal grid, and a closing call-to-action on lime ground. The whole layout scales fluidly from a single column on mobile to a 12-column asymmetric editorial grid on desktop.

What ships in the download

Five fully built pages, all responsive across 375 / 768 / 1024 / 1440 / 1920, all hand-written semantic HTML with vanilla CSS and a single tiny JS file:

• Index (index.html) — editorial hero with floating frame tag and tech-spec strip, four-stat strip (years / clients / frames / repeat rate), seven-tile selected-work grid in asymmetric sizes, reverse-tile chapter with pull-quote on a paper-ivory ground, seven-card capability bento (editorial / campaign / stills / architecture / documentary / motion / post), two split-image chapters on process and rooms, six-publication press strip, three-card journal grid, closing CTA on electric-lime ground
• Work (work.html) — archive hero with project number, seven discipline filters, a twelve-project featured grid in mixed tile sizes, a full case-study chapter on the Atrium SS25 lookbook with pull-quote, a twelve-row recent archive list with project numbers and dates, and pagination controls
• Studio (studio.html) — founding chapter (2014 → 2026) with pull-quote, four-cell awards strip, six-rule principles bento, two split-image room descriptions (280 m² Brooklyn + 140 m² Berlin) with full fact lists, and an eight-portrait team grid
• Services (services.html) — three-tier rate-card hero (Editorial / Campaign / Marque) with pricing on the card, full eight-step process grid, six-question FAQ on a reverse-tile section, closing CTA
• Contact (contact.html) — three contact channels (new project / press / careers) as bento cards, a complete eight-field intake form with country routing and tier selector, a two-room location chapter, and a three-card press kit

Design system

Brivon runs entirely on CSS custom properties — palette, type scale, spacing rhythm, motion easing, layout tokens, and three container widths (narrow / default / wide) all live as a single :root block at the top of assets/css/styles.css. The typography pairs Boldonse (display, with line-heights set safely at 1.22+ to avoid the overlap that Boldonse-class fonts cause at tight settings) with Inter Tight (body, 400–700) and Geist Mono (eyebrows, captions, tabular numbers, tech specs) — all served from Google Fonts with preconnect and font-display swap. Cards use a soft 20 px radius and a lime-tinted shadow on the featured tier card that's genuinely different from the typical Tailwind drop-shadow. The hero has a dual atmosphere — a faint lime ellipse top-right, a faint cobalt ellipse bottom-left — that gives the page warmth and depth without crossing into kitsch.

Who it's for

Use Brivon as the foundation for a commercial photography studio, an editorial photographer's site, a documentary team, a visual-arts producer, an architecture photography practice, a still-life and product studio, a fashion campaign photographer, a food photographer, a portrait specialist, or any small visual-arts agency that needs a marketing surface confident enough to charge a working rate. The charcoal ground and lime accent absorb real photography of any subject without modification; the seven-card capability bento absorbs real services; the editorial chapters absorb real studio stories without forcing them into bullet-point cards.

Other free templates from the same studio

Brivon joins a growing free catalogue on html.design — every template ships with the same craft level, all of them free to download and use. If a photo studio isn't what you need today, look at Vermora for an editorial winery and estate site, Hovara for a sage-and-clay yoga studio, Vornu for an indigo SaaS bento dashboard, Sonomir for a synthwave music label, Hopta for a warm pet food subscription brand, Recto for a type-only photography portfolio, Talasea for a boutique hotel, Volta for a high-energy fitness brand, Axioma for a left-rail creative agency, Aurix for a dark-luxury SaaS landing page, Solara for a restaurant, or Meridia for a navy-and-brass real estate site. Each one is built around a different visual recipe, and all of them are free.

Customising

Open assets/css/styles.css and edit the :root token block — change --lime to recolor every accent surface across the entire site, change --ink-deep to shift the ground darkness, or change the typography tokens to switch families. Swap the photography in assets/img/ with your own studio, project and team imagery (recommended dimensions and a full credit list are in CREDITS.md). The HTML across the five pages is short enough to read end-to-end in twenty minutes.

Free for personal and commercial use, no attribution required, no email gate. Built and maintained by html.design.