No. 01Auto detailing

Obsidian Detail Co.

A premium, five-page website for a fictional high-end auto detailer — cinematic dark design, transparent pricing and a booking-focused flow.

Concept project. Obsidian Detail Co. is a fictional business. This site was designed and built by Rogues Gallery Studio to demonstrate our work.

Type: Concept website
Year: 2026
Built with: Astro, Tailwind CSS, TypeScript, Playwright, Cloudflare Pages

Live preview coming soon

Obsidian Detail Co. homepage hero: “Paint so deep you could fall in.”

I.The brief

What it needed to do.

Show what a premium detailing business deserves online: a site that feels as considered as a concours-level finish, explains services and pricing plainly, and turns visitors into booking requests on any device.

II.The approach

How we got there.

01A dark, reflective “Obsidian & Brass” palette with one warm metallic accent, echoing paint under studio lights.
02Expanded, engineered display type for headlines paired with a quiet, highly legible body face.
03Every page built around one action — booking — with a persistent call/book bar on phones.

III.Visual identity

Palette & type.

Ink#0B0C0E
Steel#1B1E23
Bone#ECE7DF
Brass#C9A15F

DisplayArchivo Expanded
TextManrope

IV.Highlights

Built to convert.

01
Pricing that adapts
A vehicle-size toggle updates every package price instantly — built in pure CSS, so it works even without JavaScript.
02
Before/after slider
A keyboard-accessible comparison slider that shows the difference correction makes.
03
Filterable gallery
Category filters and a full-screen lightbox with arrow-key navigation.
04
Booking-first mobile
A sticky Call / Book bar, a full-screen menu and thumb-friendly 44px+ targets throughout.
05
Honest demo form
The quote form validates in the browser and clearly states that nothing is sent — no fake confirmations.
06
Search-ready
Per-page metadata, Open Graph images, a sitemap and LocalBusiness structured data.