Caffeine preset

Applies to: Local 4.2.1 and later. Added in: Local 2.6.0. Last checked: 2026-10-13 against Local 4.2.1.

The Caffeine preset is a warm, coffee-brown look made for coffee roasters and cafés. It was announced as the coffee demo preset with Local 2.6.0, in the 2025 theme updates.

Where to find it: Theme settings → Theme style → Caffeine, or the Caffeine preset on the Local page of the Shopify Theme Store.

Fonts and colorsCopy Anchor Link

• Headings: Jost Medium, base size 80 px, line height 1, letter spacing -1. Body: Jost, 18 px, line height 1.3. Menus 17 px.
• Header and body: brown background #be865c, black text, dark brown accent #4d2100.
• Cards: transparent background (they take the page color) with a brown border (#976a49) and 20 px corner radius.
• Footer: near-black #121212 with brown text.
• Layout: Maximum page width 1440 px, 100 px between sections, 30 px grid gap. Form fields have an 8 px radius.

Product cardsCopy Anchor Link

• Media aspect ratio Square (1:1), caption centered, title Large.
• Product cards have their own background #b57e55 and no border.
• Hide quick buy button when product is out of stock is on.
• The discount badge is black with orange text.
• Custom badges by roast: "LIGHT ROAST" (tag light), "MEDIUM ROAST" (tag medium) and "DARK ROAST" (tag dark), all on a brown background.
• The go to top button is on (Theme settings → Embellishments).

What to change firstCopy Anchor Link

• Tag your coffees light, medium or dark to show the roast badges, or change the badge texts and tags in Theme settings → Product card → Custom badge 1 to 3.
• Adjust the brown body color in Theme settings → Colors → Body if your product photos need a lighter background.

Demo storeCopy Anchor Link

The Caffeine demo setup video on Local presets rebuilds the coffee demo home page with sections. Demo products, pages (such as brew guides or a quiz) and extra templates are not part of the preset.

Is this preset a different theme?Copy Anchor Link

No. Every Local preset installs the same theme, with the same sections, blocks and settings. The preset only sets the starting values of Theme settings. You can switch to another preset later in Theme settings → Theme style, see Local presets.

Related pagesCopy Anchor Link

• Local presets: compare the presets and switch between them.
• Typography theme settings: change the fonts.
• Colors theme settings: change the colors.
• Product card theme settings: change the product card style.