Tome theme · Makers and small shops
Shelf. Built to sell what you make.
For makers, small-batch brands and independent shops whose store has to sit inside a real site, beside the journal, the course and the story behind the work. It reads like a well-made printed catalog that happens to take your order: the maker's voice sits beside every price, and the bag, checkout and order pages are styled with the rest of the site.
- Palettes
- 4, each light and dark
- Price
- In the Craft Library and every paid plan, or $199 once with its packs and a first year of the engines
- Demo
- Cantilever Pottery, a fictional pottery studio, with checkout in test mode
Palettes
Four palettes. Pick the one that suits what you make.
Every palette as the whole home page, side by side. Scroll inside any of them to see it top to bottom. Under the colors, the sections stay the same.
Captured from the demo at 1440px. Cantilever Pottery, a fictional pottery studio.
In every palette the buy button is ink, and the accent appears only on a real sale price, low stock and the filter count. The light palettes each have a derived dark mode, Smoke has a derived light page, and the one dark band on the page is the closing sign-up.
The sections
What each section does for the shop.
These are crops from the demo shop, in Bisque unless a row says otherwise. What do you sell, can I trust what the page tells me, and what happens after I add something to the bag?
The Catalog Shelf
The shop reads like a catalog's contents page. You number your categories in an order that means something to your buyers, and the number follows each one everywhere: the menu, the product cards, the buy box and the bag's suggestions. The latest batch leads, every row stands on a ruled shelf line with its live count from the catalog, and when you've set a date for the next batch, a dashed tile at the end of the row says when it's out.
A buy box built from real facts
Glaze and size, quantity, and an add button with the price inside it that updates as the choice changes. Under it sits one line made only from what the shop knows: the batch, "3 left" once stock is at or below the threshold you set, and the dispatch day, with an order-by time when you've set a cutoff. With no stock data it shows your store facts instead. Nothing on the page says "selling fast" or starts a timer. Shown here in Smoke.
Notes in the margin
The maker's story runs in the reading column, and the facts a careful buyer checks sit beside it: what it's made of, the glaze, who made it, the size, care, and what it goes with. Each note is one line set beside the paragraph it belongs to; on a phone the notes fold into a short two-column list after the first paragraph, never into a hidden accordion. Three of them also appear beside the featured piece on the home page.
The bag, where you pressed add
Add from a card and the button turns into a quantity stepper where it was, the bag count in the header rolls to its new number, and a screen reader hears what was added. On a product page the bag opens: every line with its own photo, a free-shipping bar that grows from where it last stood ("before discounts"), your tax note, and a checkout button carrying the total.
More than a shop
The journal and the course share the home page with the products, because the store lives inside a real site. Posts run as a lead story with rows under it, and the course card sells the course through its own checkout, since a course can't go in the bag with physical goods.
That's what a visitor sees. Here's what you get to build it.
What's in the package, and what it's built from.
Navbar 5 with its links centered: your shop's name on the left, the numbered shelves in the middle, and the account link and the bag on the right. It sits bare on the page and takes on its surface once you scroll. Footer 7 in its own tone, carrying the shelves, help links, store facts and the small print, with no call-to-action band above it.
Bisque, Stone, Pantry and Smoke. The first three are light pages with a derived dark mode; Smoke is a designed dark page with a derived light one, and it opens dark.
Anybody, a variable grotesk set wide, for the shop: headings, product names, prices, buttons and labels, with every price and count in even-width figures. Spectral for the maker: product stories, margin notes, journal prose and quotes. Both ship inside the package under the SIL Open Font License, so the site makes no third-party font request.
No filter on any product photo, so the colors a buyer sees are the colors that arrive. An optional effect lets photos shot on a white backdrop take the shelf's own tone in the light palettes; without it, every photo shows as a framed print.
The photo-and-promise hero with a shoppable caption, the store facts strip, the Catalog Shelf and its contents rows, the featured piece bought in place, the shop-by-occasion row, the making pairs and stat band, What we don't do, After the Order, quotes, the journal and course, the FAQ and the closing sign-up.
Numbered shelves and checkbox filters in a side rail (glaze, price and what's in stock), each option with its live count and the empty ones dimmed; applied filters as chips, a sort menu and a live product count. The filters live in the URL, so a link can arrive already filtered. On a phone the shelves become tabs and the filters open in a bottom sheet. A sold-out piece takes an email address for one back-in-stock note.
The bag, the checkout step, the confirmation and the order lookup share the site's type, colors and shapes. Guests check out with an email address, and payment happens on Stripe's hosted checkout, which you brand to your palette from the table in the docs. The confirmation marks the first of your After the Order steps, and a guest can find an order later by email.
Shelf runs on Tome's commerce engines: Catalog, Economy, Fulfillment and Storefront, with Storefront Blocks. Buying the theme includes them for your first year on one site. After that, the Commerce plan ($400 a year, set up with us) keeps their updates coming, and the shop you've built keeps running either way. The Craft Library and the Solo and Studio plans include the theme and its packs but not the engines; the Agency plan includes both.
Payments go to your own Stripe account, so your business is the merchant of record and the money never passes through us. Shelf doesn't calculate or collect sales tax: the bag shows a tax note you write (the default reads "Prices do not include sales tax."), and working out what's owed stays with you.
What you press springs and what you scroll glides: the bag and the filter sheet spring in, sections rise once as they arrive, and counts and prices roll like an odometer when they change. With reduced motion turned on, steppers swap instantly, numbers change without rolling and panels appear without sliding. An optional paper grain on Pantry.
None.
What it's built from
A theme owns no blocks of its own. It restyles blocks from the Tome packs below.
| On the page | Block | Pack | With the theme |
|---|---|---|---|
| Hero, quotes, FAQ | High Impact Hero, Testimonial, FAQ | Marketing Starter | Free |
| Making figures | Proposal Stat Strip | Proposal Pack | Free |
| Journal | Archive (filed variant) | Content Writer | Free |
| Shelves, contents, featured notes, gallery | Product Grid (shelf), Category Strip (contents), Featured Product (annotated), Product Gallery | Commerce Blocks | Included |
| Making pairs, closing sign-up | Split View, Form (sign-up band) | Agency Essentials | Included |
| What we don't do | Term Ledger | Dossier Blocks | Included |
| Course card | Course Card (offer) | Learning Blocks | Included |
| Section openers | Section Header (ruled split) | Extras | Included |
| Buy box, bag, store facts, checkout, confirmation, order lookup, restock | Buy Box, Cart Drawer, Cart Trigger, Store Facts, Checkout Step, Order Confirmation, Order Lookup, Restock Alert | Storefront Blocks | First year |
Buying the theme includes every pack marked Included above, so you can build the pages exactly the way the demo has them, and Storefront Blocks comes with the commerce engines for your first year. The theme also restyles any other Tome block you add.
Two ways in
Install it yourself, or have us set it up.
Developers and agencies install it themselves; business owners usually want it set up. It's the same theme either way.
Install it yourself · developers and agencies
The Craft Library
Every theme and every paid block pack, Shelf included, for $250 a year. The commerce engines Shelf runs on come with the Commerce plan, not the library.
Or just Shelf, $199 once
It includes the packs the demo is built from (Commerce Blocks, Agency Essentials, Dossier Blocks, Learning Blocks and Extras). The commerce engines it runs on (Catalog, Economy, Fulfillment, Storefront and Storefront Blocks) are included for your first year on one site; after that, the Commerce plan keeps their updates coming, and the shop keeps running either way. Each purchase covers one production site, and staging and development copies are unlimited. The purchase adds it to your account, and you install it from our registry with the token on your account page.
# after purchase: registry token from your account page
pnpm add @wabbit/tome-theme-shelf
// app/layout.tsx
import '@wabbit/tome-ui/tokens.css'
import '@wabbit/tome-theme-shelf/styles.css'
import '@wabbit/tome-theme-shelf/fonts.css'
<!-- pick the palette on the html element -->
<html data-tome-theme="shelf" data-tome-palette="pantry">Set it up for me · business owners
We set it up
We install Shelf on a new site and replace Cantilever Pottery with your shop: your shelves and products, with their variants, prices and stock; your photos and your story; your shipping threshold, returns and dispatch days; and your own Stripe account for payments. You get a written proposal with the price before any work starts, and it names the commerce engines the shop runs on and the plan that keeps them updated.
Runs on
What it runs on.
- Payload
- 3.67 or later
- Next.js and React
- Next.js 15 or later, React 19
- @wabbit/tome-ui
- 0.20.0 or later, below 1.0
- @wabbit/tome-core
- 1.23.0 or later, below 2.0. Only needed to list the theme in the admin's theme switcher.
- Commerce engines
- Catalog, Economy, Fulfillment and Storefront, with Storefront Blocks. Included for the first year on one site, then the Commerce plan.
- Payments
- Stripe hosted checkout on your own Stripe account, with guest checkout. No sales tax is calculated or collected.
- Package
- @wabbit/tome-theme-shelf 0.1.1, a preview release
- Fonts
- Self-hosted from the package, SIL Open Font License
- License
- One production site per purchase. Staging and development copies are unlimited.
Tell us about your business.
Pick a palette and tell us what the business does. We'll reply with questions or a written proposal for setting up Shelf with your details.
Installing it yourself?
The Craft Library includes Shelf, every other theme and every paid pack for $250 a year. Or buy Shelf alone for $199 once, with the packs it needs and a first year of the commerce engines, for one production site.
Set up Shelf for my business