HTML Template · 10 Demos in One Package

One template.
Ten complete farms.

Farmora 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
Farmora Green demoView Demo → Farmora GreenFresh green · glass hero panel01 Terra demoView Demo → TerraTerracotta · editorial serif magazine02 Nightfield demoView Demo → NightfieldDark + lime · technical glow03 Sunhaven demoView Demo → SunhavenWarm orange · round & cheerful04 Monoline demoView Demo → MonolineSwiss B/W · photos colorize on hover05 Riverflow demoView Demo → RiverflowDeep teal · corporate06 Golden Estate demoView Demo → Golden EstateGold serif · classic estate07 Bold Acre demoView Demo → Bold AcreBrutalist chartreuse poster08 Meadow demoView Demo → MeadowSoft sage · airy islands09 AgriTech demoView Demo → AgriTechDark mint terminal · precision farming10
What's Inside

Every detail, already designed.

Not just skins — the ten themes change layouts, section designs, sliders, maps and even the preloader.

10 Themes, 1 Codebase

Token-driven design system: each theme redefines colors, radii, fonts and whole section layouts. Lock one theme in two lines.

Per-Theme Hero Slider

4 slides with unique copy and elements per slide — dissolve, glide, circle-reveal or hard-cut transitions, styled per theme.

AI Image Prompt System

Every image slot is a smart placeholder: click it and get a ready-made Midjourney/DALL·E prompt with the exact path and size.

Mapbox Map, Themed ×10

Interactive 3D contact map with per-theme light presets, color tints and markers. One CONFIG block for your token.

Shop + Cart + Search

Product grid, detail, related items, localStorage cart with toasts and a live search overlay — all from one data.js.

Theme-Styled Preloader

Soft page transitions with a wheat-mark loading badge that adapts its shape, color and motion to the active theme.

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, noscript fallbacks, semantic markup, keyboard-closable menus.

Mobile Navigation

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

Blog & Portfolio

Grids, detail templates, related content, dynamic breadcrumbs and pagination — driven by simple arrays.

Modern Documentation

A full docs site with sidebar navigation, copy-paste snippets and an FAQ ships 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.

Farmora Green — Home pageHome INDEX.HTML Farmora Green — About Us pageAbout Us ABOUT.HTML Farmora Green — Portfolio pagePortfolio PORTFOLIO.HTML Farmora Green — Case Study pageCase Study WORK.HTML Farmora Green — Blog pageBlog BLOG.HTML Farmora Green — Blog Single pageBlog Single POST.HTML Farmora Green — Shop pageShop SHOP.HTML Farmora Green — Product pageProduct PRODUCT.HTML Farmora Green — Cart pageCart CART.HTML Farmora Green — Contacts + Map pageContacts + Map CONTACTS.HTML
Terra — Home pageHome INDEX.HTML Terra — About Us pageAbout Us ABOUT.HTML Terra — Portfolio pagePortfolio PORTFOLIO.HTML Terra — Case Study pageCase Study WORK.HTML Terra — Blog pageBlog BLOG.HTML Terra — Blog Single pageBlog Single POST.HTML Terra — Shop pageShop SHOP.HTML Terra — Product pageProduct PRODUCT.HTML Terra — Cart pageCart CART.HTML Terra — Contacts + Map pageContacts + Map CONTACTS.HTML
Nightfield — Home pageHome INDEX.HTML Nightfield — About Us pageAbout Us ABOUT.HTML Nightfield — Portfolio pagePortfolio PORTFOLIO.HTML Nightfield — Case Study pageCase Study WORK.HTML Nightfield — Blog pageBlog BLOG.HTML Nightfield — Blog Single pageBlog Single POST.HTML Nightfield — Shop pageShop SHOP.HTML Nightfield — Product pageProduct PRODUCT.HTML Nightfield — Cart pageCart CART.HTML Nightfield — Contacts + Map pageContacts + Map CONTACTS.HTML
Sunhaven — Home pageHome INDEX.HTML Sunhaven — About Us pageAbout Us ABOUT.HTML Sunhaven — Portfolio pagePortfolio PORTFOLIO.HTML Sunhaven — Case Study pageCase Study WORK.HTML Sunhaven — Blog pageBlog BLOG.HTML Sunhaven — Blog Single pageBlog Single POST.HTML Sunhaven — Shop pageShop SHOP.HTML Sunhaven — Product pageProduct PRODUCT.HTML Sunhaven — Cart pageCart CART.HTML Sunhaven — Contacts + Map pageContacts + Map CONTACTS.HTML
Monoline — Home pageHome INDEX.HTML Monoline — About Us pageAbout Us ABOUT.HTML Monoline — Portfolio pagePortfolio PORTFOLIO.HTML Monoline — Case Study pageCase Study WORK.HTML Monoline — Blog pageBlog BLOG.HTML Monoline — Blog Single pageBlog Single POST.HTML Monoline — Shop pageShop SHOP.HTML Monoline — Product pageProduct PRODUCT.HTML Monoline — Cart pageCart CART.HTML Monoline — Contacts + Map pageContacts + Map CONTACTS.HTML
Riverflow — Home pageHome INDEX.HTML Riverflow — About Us pageAbout Us ABOUT.HTML Riverflow — Portfolio pagePortfolio PORTFOLIO.HTML Riverflow — Case Study pageCase Study WORK.HTML Riverflow — Blog pageBlog BLOG.HTML Riverflow — Blog Single pageBlog Single POST.HTML Riverflow — Shop pageShop SHOP.HTML Riverflow — Product pageProduct PRODUCT.HTML Riverflow — Cart pageCart CART.HTML Riverflow — Contacts + Map pageContacts + Map CONTACTS.HTML
Golden Estate — Home pageHome INDEX.HTML Golden Estate — About Us pageAbout Us ABOUT.HTML Golden Estate — Portfolio pagePortfolio PORTFOLIO.HTML Golden Estate — Case Study pageCase Study WORK.HTML Golden Estate — Blog pageBlog BLOG.HTML Golden Estate — Blog Single pageBlog Single POST.HTML Golden Estate — Shop pageShop SHOP.HTML Golden Estate — Product pageProduct PRODUCT.HTML Golden Estate — Cart pageCart CART.HTML Golden Estate — Contacts + Map pageContacts + Map CONTACTS.HTML
Bold Acre — Home pageHome INDEX.HTML Bold Acre — About Us pageAbout Us ABOUT.HTML Bold Acre — Portfolio pagePortfolio PORTFOLIO.HTML Bold Acre — Case Study pageCase Study WORK.HTML Bold Acre — Blog pageBlog BLOG.HTML Bold Acre — Blog Single pageBlog Single POST.HTML Bold Acre — Shop pageShop SHOP.HTML Bold Acre — Product pageProduct PRODUCT.HTML Bold Acre — Cart pageCart CART.HTML Bold Acre — Contacts + Map pageContacts + Map CONTACTS.HTML
Meadow — Home pageHome INDEX.HTML Meadow — About Us pageAbout Us ABOUT.HTML Meadow — Portfolio pagePortfolio PORTFOLIO.HTML Meadow — Case Study pageCase Study WORK.HTML Meadow — Blog pageBlog BLOG.HTML Meadow — Blog Single pageBlog Single POST.HTML Meadow — Shop pageShop SHOP.HTML Meadow — Product pageProduct PRODUCT.HTML Meadow — Cart pageCart CART.HTML Meadow — Contacts + Map pageContacts + Map CONTACTS.HTML
AgriTech — Home pageHome INDEX.HTML AgriTech — About Us pageAbout Us ABOUT.HTML AgriTech — Portfolio pagePortfolio PORTFOLIO.HTML AgriTech — Case Study pageCase Study WORK.HTML AgriTech — Blog pageBlog BLOG.HTML AgriTech — Blog Single pageBlog Single POST.HTML AgriTech — Shop pageShop SHOP.HTML AgriTech — Product pageProduct PRODUCT.HTML AgriTech — Cart pageCart CART.HTML AgriTech — 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 3D map
AaGoogle Fonts13 curated families · 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.

i-wheat
i-search
i-cart
i-arrow
i-chev-up
i-pin
i-phone
i-mail
i-sprout
i-tractor
i-drop
i-barn
i-sensor
i-bars
i-p-seed
i-p-leaf
i-p-sun
i-p-plant
i-p-bars
i-p-frame

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 brand change 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{
  --green-900:#1D3A20;   /* deep surfaces */
  --olive:#5F7048;       /* section bands */
  --yellow:#F1EC9F;      /* accent surfaces */
  --ink:#1B1E17;         /* text */
  --paper:#FFFFFF;       /* page background */
  --radius-xl:28px;      /* shape language */
}
Interactive Map

One map, ten moods.

The Mapbox contact map re-styles itself per theme — light presets, palette tints and markers included. Click any to try it live.

Farmora Green mapFarmora Green · day preset · olive tint Terra mapTerra · custom Warm style Nightfield mapNightfield · night · lime marker Sunhaven mapSunhaven · dusk · orange tint Monoline mapMonoline · grayscale · color on hover Riverflow mapRiverflow · dawn · teal tint Golden Estate mapGolden Estate · Warm style · gold frame Bold Acre mapBold Acre · day · chartreuse tint Meadow mapMeadow · faded · sage tint AgriTech mapAgriTech · night mono · mint glow
Compare

Which theme fits your farm?

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

Theme Typography Layout character Best for
01 Farmora Green Hanken Grotesk Fresh & friendly, glass hero panel Co-ops, produce brands Demo →
02 Terra Fraunces serif + Inter Editorial magazine, italic accents Family farms, heritage estates Demo →
03 Nightfield Space Grotesk Dark surfaces, lime glow, staggered grids Agri-startups, night ops Demo →
04 Sunhaven Outfit Round islands, wave dividers, sunny cards Farm shops, family markets Demo →
05 Monoline Archivo Swiss B/W, hairline rules, hover color Design-led brands, studios Demo →
06 Riverflow DM Sans Deep teal chapters, lead-story cases Irrigation, corporate agri Demo →
07 Golden Estate Playfair Display + Jost Ceremonial symmetry, gold plaques Wineries, premium estates Demo →
08 Bold Acre Anton + Archivo Brutalist posters, tilted stickers Bold DTC brands, markets Demo →
09 Meadow Sora Soft sage islands, breathing space Organic, wellness, apiaries Demo →
10 AgriTech Chakra Petch + Inter Terminal panels, blueprint grids Precision farming, IoT Demo →
Changelog

Release notes

v1.0.0Initial release
  • 10 complete demo themes sharing one codebase, with a persistent theme switcher
  • 10 page templates: home, about, portfolio + case, blog + post, shop + product + cart, contacts
  • 4-slide hero with per-theme transitions, copy and signature elements
  • AI image prompt system on every image slot
  • Mapbox GL contact map themed per demo, with graceful no-token fallback
  • Soft page transitions with theme-styled wheat-mark preloader
  • Responsive layouts verified from 390px phones to 4K and ultra-wide
  • Modern documentation site + 20-icon SVG library included

Ready to plant your site?

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