Theme System

Each shop can have its own visual theme. Choose from 5 built-in presets or create a custom theme with the color picker.

Presets

Preset	Primary Color	Description
Green	Green	Default fresh look
Red	Red	Bold accent
Blue	Blue	Clean professional
Yellow	Yellow/Gold	Warm accent
Dark	Dark grey	Minimal dark theme

Custom Theme

Select Custom to open the color picker. The system auto-generates all theme variants from a single hex color:

• primary — Main accent color
• primaryDark — Darker variant
• primaryLight — Lighter variant
• background — UI background
• surface — Card/panel backgrounds
• surfaceLight — Elevated surface
• border — Border color
• text — Primary text
• textMuted — Secondary text

How It Works

1. Open the admin panel and go to the Theme tab
2. Select a preset or click Custom to pick a color
3. Preview changes in real-time with the live preview
4. Click Save to apply the theme

The theme is stored per shop in the database and applied via CSS custom properties when a customer opens the shop UI.