Customizing Colors and Typography
Every brand has its own visual identity. Nuvi lets you customize colors and fonts to make your store uniquely yours.
Accessing the Customizer
- Go to Settings > Themes.
- Click "Customize" on your active theme.
- The customization panel opens with color and typography options.
Color Customization
Nuvi uses a primary/secondary color system:
- Primary Color — Used for buttons, links, active states, and key UI elements. Choose a color that represents your brand.
- Secondary Color — Used for accents, hover states, and secondary actions.
- Background Color — The main background of your storefront.
- Text Color — The default color for body text.
Use the color picker to select colors visually, or enter a hex code (e.g., #1a1a2e) for precise control.
Typography
Select fonts for your storefront:
- Heading Font — Used for H1-H6 headings, navigation, and prominent text.
- Body Font — Used for paragraphs, product descriptions, and general content.
Nuvi supports Google Fonts, giving you access to hundreds of typefaces. Popular combinations include:
- Heading: Inter / Body: Inter (modern, versatile)
- Heading: Playfair Display / Body: Source Sans Pro (elegant)
- Heading: Plus Jakarta Sans / Body: Plus Jakarta Sans (clean, professional)
Using the AI to Customize
You can also use the AI assistant for quick changes:
- "Change primary color to navy blue"
- "Set the heading font to Playfair Display"
- "Make the background color light gray"
Previewing Changes
All changes are saved immediately and reflected on your live storefront. Open your store in a new tab to preview how the changes look to customers.