Theme Settings
Customise the look and feel of your online storefront to match your brand. All changes are applied instantly — no code deployment required.
Colour palette
Set your brand colours using the colour picker. The storefront uses CSS custom properties, so changes are reflected in real-time:
- Background colour — The main page background.
- Foreground colour — Primary text colour.
- Card background — Background for menu item cards and containers.
- Muted colour — Secondary/subtle backgrounds and borders.
- Accent colour — Used for badges, highlights, and secondary actions.
A colour palette object stores your complete theme, ensuring consistency across the entire storefront.
Screenshot: Theme settings page with colour pickers, font selectors, and live preview
Typography
- Display font — Used for headings, hero text, and category titles. Choose from a curated list or enter a custom Google Font name.
- Body font — Used for descriptions, prices, and general text.
- Body font size — Base font size for body text.
- Heading font weight — Control how bold headings appear.
Button styling
- Button style — Choose between filled, outlined, or ghost buttons.
- Button radius — From sharp corners to fully rounded pill buttons.
Hero section
Customise the hero banner at the top of your storefront:
- Hero image — Upload a high-quality banner image (recommended: 1920×1080px).
- Hero title — Main headline text.
- Hero subtitle — Supporting text below the headline.
- CTA button text — The call-to-action button label (e.g. "Order Now", "View Menu").
Additional sections
Your storefront landing page can include optional feature sections:
- Signature dish — Highlight a featured dish with image, heading, description, and CTA.
- Dining experience — Showcase your restaurant's ambiance.
- Catering — Promote your catering services.
- Promo cards — Configurable promotional cards below the hero.
- FAQs — Frequently asked questions section.
- Reviews — Customer testimonials.
Logo
Upload your restaurant logo (recommended: SVG or PNG with transparent background). The logo appears in the storefront header and on order receipts.
Tip: Use your brand's primary colour as the background or accent — consistency with your physical branding helps customers recognise your online presence.