Musée

Musée is an open-source, self-hosted image gallery template built on Astro that ships zero client-side JavaScript while preserving a true masonry layout.

What is Musée?

Musée is a self-hosted photo gallery template that statically generates a responsive gallery website from a folder of original images. It takes your source images, generates thumbnails, compresses originals, strips metadata during the build, and outputs a site that works fully with JavaScript disabled. The template is built with Astro and styled with TailwindCSS, written in TypeScript, and is authored by obviyus (maintained on GitHub as obviyus/musee). It began as a Remix experiment before being rewritten on Astro, replacing the Ruby-based photo-stream solution the author previously ran.

Key Features

• Zero JavaScript delivered — The gallery sends no client-side JavaScript; even the masonry layout and animations are pure CSS.
• True masonry with horizontal ordering — Astro pre-computes the column distribution for each breakpoint at build time, and CSS media queries swap between pre-rendered layouts.
• Image preprocessing — Thumbnails are generated, original images are compressed, and EXIF metadata is stripped before deployment.
• Static generation — The site is fully statically generated, so it works on any static host and with JavaScript disabled.
• TypeScript support — The template source is written in TypeScript for typed components and configuration.
• TailwindCSS styling — Utility-first CSS is used for responsive layout and styling.
• OpenGraph meta tags — Social sharing previews are built into the generated pages.
• CSS-only animations — Animations run without JavaScript libraries.

Who is it for?

• Photographers who want a fast, self-hosted gallery to showcase their work without sending heavy JavaScript to visitors.
• Developers who prefer a straightforward Astro + TailwindCSS stack and want a statically generated photo site they can extend.
• Privacy-focused individuals who value automatic metadata stripping to keep location and camera data out of published images.

Use cases

• Personal photography portfolio: Drop originals into src/assets/images/original, run bun install and bun run dev, and get a responsive masonry gallery ready for deployment.
• Self-hosted gallery deployment: Deploy the static output to Cloudflare Pages using the included documentation and bun run deploy:personal script.
• Serverless/static hosting experiments: Use the template as a reference for achieving zero-JS layouts and CSS-only interactivity in a static site generator.

How does it work?

Copy your images into src/assets/images/original (a gitignored directory), run bun install to install dependencies, then bun run dev for development. During the build, Astro pre-calculates masonry column counts per breakpoint, generates thumbnails, compresses originals, and strips metadata — outputting a static site that you can deploy. Files named slug__filename.webp keep slug as the public route; other images receive stable slugs automatically.

Alternatives

• waschinski/photo-stream — the Ruby-bound photo stream that Musée was built to replace; it requires Ruby instead of a Node.js/Astro toolchain.

FAQ

Does Musée work without JavaScript?

Yes. Musée ships zero client-side JavaScript. The masonry layout, lazy-loading behavior, and animations are all pre-rendered at build time and controlled with CSS media queries and pure CSS animations, so the gallery works even with JavaScript disabled in the browser.

Is Musée free to use?

Musée is an open-source project hosted on GitHub under the obviyus/musee repository. You can clone it, customize it, and self-host it without paying a license fee. A live demo is available at gallery.obviy.us.

How do I get my own gallery running?

Install the dependencies with bun install, place your original images in src/assets/images/original, then run bun run dev for local development. When you are ready to publish, follow the Astro on Cloudflare Pages documentation and use the provided deploy script.

What image processing happens during the build?

The build generates thumbnails, compresses the original images, and strips metadata such as EXIF data before deployment. That means location and camera details are not exposed when the site goes live.

Are captions and geo-tag maps supported?

Not yet. The repository lists captions, device metadata, and image geo-tag map generation as unchecked roadmap items, so those features are not currently implemented.