Storefront Themes
Pick a complete storefront design, pair it with any color palette, edit content and SEO beside a live preview, and save when it looks right.
Your storefront ships with a gallery of professionally designed themes. A theme is a complete design, not a color swap: it changes the header, homepage hero, product cards, the product page structure, checkout and tracking pages, the mobile navigation, button shapes, and even the icon stroke style. Colors are a separate choice, so any design can wear any palette.
Open the Theme Builder
- Go to Online Store > Theme and click Open Theme Builder. The builder opens full screen: your editing panel on one side and a live preview of your real store on the other.
- Pick a design from the Design panel. Each card shows the design's default colors, name, and the kind of shops it fits best. The preview rebuilds immediately with your real products.
- Pick colors from the Colors panel, or keep Theme colors to use the palette the design was created with.
- Fine-tune fonts and corner roundness from the Style panel.
- Click Save Theme. Customers see the new look within a minute. Until you save, nothing changes for shoppers.
On a phone, the builder stacks: the live preview sits on top and the panels become tabs below it, so you can restyle your store entirely from your pocket.
The Design Gallery
| Theme | Design | Great for |
|---|---|---|
| Classic | Balanced layout, carousel hero, labeled mobile nav | Any store |
| Bistro | Centered identity, split hero, rounded corners | Restaurants, cafes, bakeries |
| Market | Dense grid, compact product cards, bold icons | Supermarkets, minimarkets |
| Clinic | Airy minimal bars, stacked product page, thin icons, flat order pages | Pharmacies, optics, beauty care |
| Tech | Full-bleed hero, image-overlay cards, gallery product page, floating icon nav | Electronics, mobile shops, hardware |
| Boutique | Centered premium layout, gallery product page, thin icons, flat order pages | Jewelry, furniture, gifts |
| Fashion | Magazine-style slim bars, stacked product page, monochrome default palette | Clothing, boutiques |
| Playful | Rounded pill corners, cheerful default pastels, bold icons | Gift shops, bookstores, stationery |
Note
If no theme is selected, your storefront uses the Classic look. You can return to it any time with Reset to Default.
Colors Are Yours to Swap
The Colors panel lists every palette in the catalog, each with light and dark variants:
- Theme colors (the default) follows whatever palette the selected design was created with. Switching designs switches colors with it.
- Picking a named palette locks your colors: you can put the Warm Terracotta palette on the Tech design, or the Monochrome palette on the Playful design.
- Custom colors builds a palette around YOUR brand: pick one color and complete light and dark palettes are derived from it automatically, with text contrast handled for you.
- Every palette is contrast-checked for readability in both light and dark mode.
Style, Logo, Banners, and Content
Four more panels finish the picture, all against the same live preview:
- Style: six font pairings (every one covers Arabic and English scripts) and corner roundness from
SharptoPill. Keep Theme default to use what the design ships with. - Logo: upload the logo shown in your storefront header and receipts.
- Banners: your home-page hero images. Upload, re-order by drag, and set click-through links; every design shows all of them.
- Content: the announcement bar text and footer text in both languages. Saving here updates the preview right away.
Note
Logo, Banners, and Content live in the builder so you can see every change beside the live preview. SEO lives under Online Store > SEO, custom pages under Online Store > Pages, contacts and social links under Online Store > Contacts & Social, and featured products under Online Store > Featured Products.
Live Preview
The builder canvas renders your actual storefront with the draft settings applied:
- Switch between desktop and mobile widths to check both experiences.
- Draft changes are visible only to you. Customers keep seeing the saved look until you click Save Theme.
Note
The preview needs an Active storefront. If your online store is inactive, activate it from Online Store > General first.
Light and Dark Mode
Every palette ships with matching light and dark variants. Customers still switch modes from the storefront header, and your design keeps its identity in both.
Related
- Storefront Appearance: Logo, hero banners, and featured products
- Online Storefront Overview: What customers see across the full storefront
- Sharing Your Store: Share your subdomain link and QR poster