HTML Template · 10 Demos in One Package

One template.
Ten complete firms.

Verdicta ships with ten fully-designed demo themes — different layouts, typography and moods, all sharing one clean codebase. Pick your favourite below.

Explore the Demos ↓ What's Inside
10THEMES
10PAGES EACH
100%RESPONSIVE
0BUILD STEPS
Verdicta Navy demoView Demo → Verdicta NavyClassic navy & gold · editorial serif01 Heritage demoView Demo → HeritagePrinted legal record · broadsheet02 Nocturne demoView Demo → NocturneNear-black & brass · after dark03 Haven demoView Demo → HavenWarm terracotta · friendly counsel04 Sterling demoView Demo → SterlingEmerald restraint · quiet luxury05 Harbor demoView Demo → HarborCoastal blue · clear & open06 Chancery demoView Demo → ChanceryDark bronze · chambers library07 Ashcroft demoView Demo → AshcroftClaret & gilt · engraved plates08 Solace demoView Demo → SolaceSoft sage · calm counsel09 Ledger demoView Demo → LedgerSteel-blue · precise & measured10
What's Inside

Every detail, already argued.

Not just skins — the ten themes change layouts, section designs, hero copy and typography from the ground up.

10 Themes, 1 Codebase

Token-driven design system: each theme redefines colors, radii, fonts and whole section layouts. Switch with ?theme=N — the choice persists via localStorage.

Per-Theme Hero Slides

Hero slides with unique headlines, stats, quotes and CTAs written per theme — a heritage firm and a modern practice never say the same thing.

AI Image Prompt System

Every image slot is a smart placeholder: click it and copy a ready-made AI image prompt with the exact path and size for that slot.

Mapbox Contact Map

Interactive 3D contact map with theme-colored markers. No token yet? A friendly placeholder explains exactly where to add it.

Shop + Cart + Search

Legal guides and consultation products: grid, detail, related items, localStorage cart with toasts and a live search overlay — all from one data.js.

Page-Transition Preloader

Soft page transitions with a loading badge that recolors itself to the active theme — navigation feels composed, never abrupt.

Responsive 390px → 4K

Verified with real layout measurements on phones, tablets, laptops, 1080p, 2K, ultra-wide and 4K. Zero horizontal overflow.

Zero Dependencies

Hand-written vanilla JS — no jQuery, no frameworks, no build step. Open index.html and it runs.

Accessible & Considerate

prefers-reduced-motion support, semantic markup, keyboard-closable menus and graceful fallbacks throughout.

Mobile Navigation

Burger + full-screen panel generated from your menu automatically — edit navigation once, mobile stays in sync.

Blog & Case Results

Insights blog, portfolio of case results, detail templates, related content, dynamic breadcrumbs and pagination — driven by simple arrays.

Practice-Ready Copy

Every headline, stat and bio is written for a law firm — litigation, family law, corporate counsel — no lorem ipsum anywhere in the package.

Page Templates

All 10 pages, in every theme.

Each demo includes the complete set — pick a theme to browse its full-page screenshots. Hover a card to scroll the whole page.

Verdicta Navy — Home pageHome INDEX.HTML Verdicta Navy — About Us pageAbout Us ABOUT.HTML Verdicta Navy — Case Results pageCase Results PORTFOLIO.HTML Verdicta Navy — Case Study pageCase Study WORK.HTML Verdicta Navy — Blog pageBlog BLOG.HTML Verdicta Navy — Blog Single pageBlog Single POST.HTML Verdicta Navy — Shop pageShop SHOP.HTML Verdicta Navy — Product pageProduct PRODUCT.HTML Verdicta Navy — Cart pageCart CART.HTML Verdicta Navy — Contacts + Map pageContacts + Map CONTACTS.HTML
Heritage — Home pageHome INDEX.HTML Heritage — About Us pageAbout Us ABOUT.HTML Heritage — Case Results pageCase Results PORTFOLIO.HTML Heritage — Case Study pageCase Study WORK.HTML Heritage — Blog pageBlog BLOG.HTML Heritage — Blog Single pageBlog Single POST.HTML Heritage — Shop pageShop SHOP.HTML Heritage — Product pageProduct PRODUCT.HTML Heritage — Cart pageCart CART.HTML Heritage — Contacts + Map pageContacts + Map CONTACTS.HTML
Nocturne — Home pageHome INDEX.HTML Nocturne — About Us pageAbout Us ABOUT.HTML Nocturne — Case Results pageCase Results PORTFOLIO.HTML Nocturne — Case Study pageCase Study WORK.HTML Nocturne — Blog pageBlog BLOG.HTML Nocturne — Blog Single pageBlog Single POST.HTML Nocturne — Shop pageShop SHOP.HTML Nocturne — Product pageProduct PRODUCT.HTML Nocturne — Cart pageCart CART.HTML Nocturne — Contacts + Map pageContacts + Map CONTACTS.HTML
Haven — Home pageHome INDEX.HTML Haven — About Us pageAbout Us ABOUT.HTML Haven — Case Results pageCase Results PORTFOLIO.HTML Haven — Case Study pageCase Study WORK.HTML Haven — Blog pageBlog BLOG.HTML Haven — Blog Single pageBlog Single POST.HTML Haven — Shop pageShop SHOP.HTML Haven — Product pageProduct PRODUCT.HTML Haven — Cart pageCart CART.HTML Haven — Contacts + Map pageContacts + Map CONTACTS.HTML
Sterling — Home pageHome INDEX.HTML Sterling — About Us pageAbout Us ABOUT.HTML Sterling — Case Results pageCase Results PORTFOLIO.HTML Sterling — Case Study pageCase Study WORK.HTML Sterling — Blog pageBlog BLOG.HTML Sterling — Blog Single pageBlog Single POST.HTML Sterling — Shop pageShop SHOP.HTML Sterling — Product pageProduct PRODUCT.HTML Sterling — Cart pageCart CART.HTML Sterling — Contacts + Map pageContacts + Map CONTACTS.HTML
Harbor — Home pageHome INDEX.HTML Harbor — About Us pageAbout Us ABOUT.HTML Harbor — Case Results pageCase Results PORTFOLIO.HTML Harbor — Case Study pageCase Study WORK.HTML Harbor — Blog pageBlog BLOG.HTML Harbor — Blog Single pageBlog Single POST.HTML Harbor — Shop pageShop SHOP.HTML Harbor — Product pageProduct PRODUCT.HTML Harbor — Cart pageCart CART.HTML Harbor — Contacts + Map pageContacts + Map CONTACTS.HTML
Chancery — Home pageHome INDEX.HTML Chancery — About Us pageAbout Us ABOUT.HTML Chancery — Case Results pageCase Results PORTFOLIO.HTML Chancery — Case Study pageCase Study WORK.HTML Chancery — Blog pageBlog BLOG.HTML Chancery — Blog Single pageBlog Single POST.HTML Chancery — Shop pageShop SHOP.HTML Chancery — Product pageProduct PRODUCT.HTML Chancery — Cart pageCart CART.HTML Chancery — Contacts + Map pageContacts + Map CONTACTS.HTML
Ashcroft — Home pageHome INDEX.HTML Ashcroft — About Us pageAbout Us ABOUT.HTML Ashcroft — Case Results pageCase Results PORTFOLIO.HTML Ashcroft — Case Study pageCase Study WORK.HTML Ashcroft — Blog pageBlog BLOG.HTML Ashcroft — Blog Single pageBlog Single POST.HTML Ashcroft — Shop pageShop SHOP.HTML Ashcroft — Product pageProduct PRODUCT.HTML Ashcroft — Cart pageCart CART.HTML Ashcroft — Contacts + Map pageContacts + Map CONTACTS.HTML
Solace — Home pageHome INDEX.HTML Solace — About Us pageAbout Us ABOUT.HTML Solace — Case Results pageCase Results PORTFOLIO.HTML Solace — Case Study pageCase Study WORK.HTML Solace — Blog pageBlog BLOG.HTML Solace — Blog Single pageBlog Single POST.HTML Solace — Shop pageShop SHOP.HTML Solace — Product pageProduct PRODUCT.HTML Solace — Cart pageCart CART.HTML Solace — Contacts + Map pageContacts + Map CONTACTS.HTML
Ledger — Home pageHome INDEX.HTML Ledger — About Us pageAbout Us ABOUT.HTML Ledger — Case Results pageCase Results PORTFOLIO.HTML Ledger — Case Study pageCase Study WORK.HTML Ledger — Blog pageBlog BLOG.HTML Ledger — Blog Single pageBlog Single POST.HTML Ledger — Shop pageShop SHOP.HTML Ledger — Product pageProduct PRODUCT.HTML Ledger — Cart pageCart CART.HTML Ledger — Contacts + Map pageContacts + Map CONTACTS.HTML
Tech Stack

Clean, modern, dependency-free.

Everything is hand-written and readable — nothing to install, nothing to compile.

5HTML5semantic markup
3CSS3custom properties · grid · clamp()
JSVanilla JavaScriptzero dependencies · no jQuery
MMapbox GL JSinteractive contact map
AaGoogle Fontscurated serif & sans pairings · OFL
◈SVG Icon System20 mask icons · currentColor
⚡No Build Stepopen & deploy anywhere
Icon Library

20 crafted line icons, included.

A consistent SVG mask set that inherits the current text color — recolor with one CSS rule. Source SVGs ship in the package.

scale
gavel
column
briefcase
shield
bank
document
search
cart
arrow-right
chevron-up
pin
phone
mail
partner-diamond
partner-frame
partner-globe
partner-laurel
partner-pillar
partner-shield

One token file drives every theme.

Colors, radii and type flow from CSS custom properties. Each theme redefines the tokens and adds its own layout chapter — your firm's rebrand is a five-minute edit.

  • Buttons, badges, map markers & preloader recolor automatically
  • Theme switcher persists via localStorage & ?theme=N URLs
  • Lock production to a single theme in two lines
:root{
  --navy-900:#16233B;   /* deep surfaces */
  --gold:#D2AC47;       /* accents & markers */
  --ivory:#F1E9D2;      /* warm highlights */
  --ink:#191D26;        /* text */
  --paper:#FFFFFF;      /* page background */
  --radius-xl:10px;     /* shape language */
  --font-display:"Cormorant Garamond",Georgia,serif;
}
Interactive Map

Mapbox contact map, ready to go.

Every demo ships the same clean Mapbox Standard basemap with 3D buildings — the location pin simply picks up each theme's accent color. Click to try it live.

Verdicta contact mapMapbox Standard · theme-colored marker
Compare

Which theme fits your firm?

Same content, ten personalities — pick by typography, mood and layout character.

Theme Typography Layout character Best for
01 Verdicta Navy Cormorant Garamond + Hanken Grotesk Classic navy & gold, editorial hairlines Full-service firms, corporate counsel Demo →
02 Heritage Playfair Display + Source Serif 4 Printed legal record, broadsheet columns Heritage practices, appellate boutiques Demo →
03 Nocturne Sora Near-black surfaces, brass accents Criminal defense, high-stakes litigation Demo →
04 Haven Figtree Warm friendly terracotta, soft shapes Family law, community legal clinics Demo →
05 Sterling Newsreader + Inter Emerald restraint, quiet luxury Private client, wealth & estates Demo →
06 Harbor Instrument Sans Coastal blue, clear & open chapters Immigration, insurance & maritime law Demo →
07 Chancery Cormorant Garamond + Hanken Grotesk Dark bronze library, gilded plaques Chambers, tax & chancery practice Demo →
08 Ashcroft Libre Caslon Text + Hanken Grotesk Claret & gilt, engraved plate borders Boutique litigation, trial lawyers Demo →
09 Solace Lora + Hanken Grotesk Soft sage calm, breathing space Estate planning, elder law, mediation Demo →
10 Ledger Manrope Steel-blue precision, ruled grids Corporate counsel, compliance & fintech Demo →
Changelog

Release notes

v1.0Initial release
  • 10 complete demo themes sharing one codebase, with a persistent theme switcher
  • 10 page templates: home, about, case results + case study, blog + post, shop + product + cart, contacts
  • Per-theme hero slides with unique copy, stats, quotes and signature elements
  • AI image prompt system on every image slot
  • Mapbox GL contact map with theme-colored marker and graceful no-token fallback
  • Soft page transitions with a theme-styled preloader
  • Responsive layouts verified from 390px phones to 4K and ultra-wide
  • 20-icon SVG library and lorem-free, law-firm-ready copy throughout

Ready to make your case?

Browse the 10 Demos Open the Main Demo
About Us

Crafted by Algoritmetic.

Algoritmetic is an independent design & development studio building premium, hand-crafted website templates. We obsess over the details most templates skip — token-driven design systems, real responsive verification, dependency-free code you can actually read — so your project starts on solid ground.

Design-First

Every theme is designed as a complete product — layouts, typography and motion tuned together, not recolored copies.

Engineering Care

Clean vanilla code, zero dependencies, no build step. What you download is what runs — readable and easy to extend.

Long-Term Support

Templates are maintained products: documentation, updates and a support inbox that answers.

Contact Us

Questions? We answer.

Pre-sale questions, support requests or customization work — reach us anytime.

support@algoritmetic.comsupport & pre-sale questions algoritmetic.comour studio & other products