Grove
A calm SaaS landing theme for products that would rather explain than shout.



- 52 / 52
- light / dark tokens
- 2
- modes, both designed
- 1
- DOM, rendered twice
- unlimited projects, client work included
- 12 months of updates
- 14 days, no questions
AGENTS.md and 4 skills ship in the zip, so your own agent keeps changing it after you buy.
docs — install, use, customizepages, composed from 21 sections
Every page is a real render from the publish gate, in the mode on show. Open any of them in the live preview.
Home/- site-header
- hero
- logo-cloud
- feature-showcase
- feature-split
- +6
Pricing/pricing- site-header
- page-header
- pricing-table
- pricing-comparison
- faq
- +3
Journal/blog- site-header
- page-header
- blog-index
- newsletter
- site-footer
Walkthrough/demo- site-header
- page-header
- walkthrough
- testimonials
- cta
- +1
Month-end guide/month-end-guide- site-header
- page-header
- guide
- testimonials
- logo-cloud
- +2
Start free/signup- site-header
- auth-form
- logo-cloud
- cta
- site-footer
Sign in/login- site-header
- auth-form
- site-footer
Contact/contact- site-header
- contact-map
- contact-desk
- logo-cloud
- cta
- +1
Privacy and terms/privacy- site-header
- page-header
- legal-doc
- cta
- site-footer
The design system/components- site-header
- hero
- logo-cloud
- feature-showcase
- feature-split
- +16
Every row-like thing in it — the ledger table, the close checklist, the invoice list, the month-end register — sits on one 3rem pitch, so unrelated panels on unrelated pages line up like columns of the same book. Warm-paper palette at a declared 86° undertone, a deep green ink and a real ochre second hue carrying the status pills and the form error states. Typography is shipped, not wished for: Fraunces for display, Instrument Sans for text and IBM Plex Mono for the ledger register, self-hosted and OFL-licensed, on a 1.250 modular scale that lives in tokens rather than in 253 hardcoded utilities. Ships ten pages — home, pricing, blog, a chaptered product walkthrough, a long-form guide, a contact page with a hand-drawn area map that needs no tile provider, a combined privacy-cookies-terms page, sign-up and sign-in screens, and a living /components styleguide that renders every token and section on one page — with twenty-one independent sections. The interactive parts work: a light/dark toggle in the navbar that remembers, a monthly/yearly billing switch on the pricing cards, and three forms that validate in the browser with designed error and success states. A pricing table people read backed by a full comparison matrix, and a deliberate warm dark mode (not an inverted grey). Every internal link lands on a real page: no dead CTAs to wire up before you can demo it, and the blog's article and topic hrefs are the only fixtures, left pointing at your CMS on purpose. Built for Tailwind v4, Next.js 15 and React 19; every colour, size, duration and easing routes through semantic tokens in a single theme.css, so rebranding is a one-file edit. The three journal covers and the three author portraits are AI-generated and ship with the theme — no stock licence to buy, and the prompts are included so you can regenerate them.
sections and primitives
You get the parts, not just the demo site. Every frame is a real capture from the theme's own styleguide page, and the source path under it is where the file lands in your project.
hero
src/components/hero.tsx
Asymmetric-offset hero (A8): editorial headline, lead, one primary action and a subordinate text link in columns 2-7 of twelve, beside a token-built ledger panel that runs off the right frame edge from lg up and returns to the flow below it; the panel's four-cell summary rail is set at 130% of the panel so three cells and their closing hairline fill the frame and the fourth runs off it. The section ground is one radial paper wash. Owns the home page's h1, demotable to h2 via headingLevel for the styleguide
tokens, both modes
Change one variable and every part follows. Each badge is one token split down the middle: its light value on the left, its dark value on the right, with the theme's own paired ink on both halves.
hover or tab a badge for its name and both values, enter copies
The rules moved off the paper and into the ledger: every row-like structure in Grove — table row, checklist line, invoice row, summary rail cell, register row — is locked to one 3rem pitch with a hairline under it, so unrelated panels on unrelated pages line up like columns of the same book. (Through 2.1.0 the page ground was ruled at the same pitch; 2.2.0 removed the visible ruling and kept the structure it was tracing.)
every token
typefaces, self-hosted
Real woff2 files in src/fonts/, wired through next/font and licensed under OFL. Nothing is fetched from Google at build time, so the zip renders these letterforms offline. Scale ratio 1.25.
Grove
A calm SaaS landing theme for products that would rather explain than shout.
const { open, close } = useLedger("2026-03") // 0123456789
- display
- Fraunces
- text
- Instrument Sans
- mono
- IBM Plex Mono
- captionAg
- smallAg
- bodyAg
- leadAg
- d1Ag
- d2Ag
- d3Ag
- d4Ag
every width is a real render from the publish gate
Four viewports, each one a render the gate produced and checked. Switch between them: the frame narrows exactly as a window does, because that is what it is.

every token and every part on one page
The styleguide route is not documentation about the theme. It is a page in the zip that renders the real components from the real tokens, so it stays true the day you change one.
agent files in the zip
Unzip it and run it, or install it into a project you already have. Either way the theme arrives with the instructions an agent needs to extend it without guessing at your conventions.
- AGENTS.mdthe theme's own rules, written for an agent
- .claude/skills/4 skills
- add-pageCompose a new page for the Grove theme out of its existing sections, matching the shell, background rhythm and manifest entries of its six existing pages
- add-sectionAdd a new self-contained section component to the Grove theme following its existing file, token and rhythm patterns, then wire it into a page and the manifest
- check-qualityRun Grove's own quality gate locally
- rebrandRe-colour the Grove theme to a buyer's brand by editing tokens in themes/grove/src/theme.css only, keeping both light and dark complete and re-verifying WCAG AA
- theme.jsontokens, pages and components, machine readable
- src/components/21 sections, 10 primitives
- src/app/10 pages, styleguide included
activity
- v2.2 — ruling removed, /contact + /privacy, dark toggle, live formstoday
- v2.2 — rules into the ledger, /contact with the drawn map, /privacy, portraits, pricing switchtoday
- v2.1 — /month-end-guide: the prose surface the footer promisedtoday
- v2.0 — Fraunces ledger type, ruled-paper signature, ochre accenttoday
- v1.1 — lucide icon system + polish passtoday
- v1.6 — generated paper grain in the hero, token-tinted masktoday
- v1.5 — token-driven background effects: ruled hero, washed CTAtoday
- v1.4 — /components living styleguidetoday
- v1.2 — signup, sign-in and walkthrough pages; every link resolvestoday
- v1.0 — pricing table people actually readyesterday
- testimonial section variantsin progress
- changelog pageplanned
for agents
This listing is also a markdown document and a JSON endpoint. The theme's own agent files are on the plate above.
comments
Ask about the theme before you buy, or say what you did with it after.



