Introduction to Fynd Commerce Themes

Themes define the presentation and customer experience of a Fynd Commerce storefront. They control how shoppers discover products, navigate collections, view product details, manage their cart, complete checkout, access their account, and interact with branded content.

Fynd Commerce themes use React 18 and a modular structure of pages, sections, blocks, layouts, components, styles, and locale resources. Commerce data and actions are provided through the Fynd Platform Interface (FPI) and GraphQL APIs.

Developers can use themes to:

• Build responsive storefront experiences for desktop and mobile
• Customize branding, typography, colors, navigation, and page layouts
• Create reusable sections and components
• Integrate catalog, cart, checkout, customer, and order journeys
• Add localization and right-to-left language support
• Extend storefront functionality through apps and web theme bindings

Build and Extend Themes

Fynd Partners can work with themes in several ways:

• Customize an existing theme: Modify an installed theme to match a seller's branding or business requirements.
• Build a bespoke storefront: Create a dedicated storefront experience for a specific seller.
• Distribute a theme: Build and submit a Fynd-hosted theme to the Fynd Partners Marketplace.
• Build storefront extensions: Add functionality through web theme bindings.

Fynd provides Turbo Theme as the reference implementation for theme development. Developers can use its pages, sections, components, layouts, data patterns, and storefront journeys as a starting point.

Choose a Storefront Approach

Fynd Commerce supports two approaches that share the same core storefront development model:

1. Fynd-hosted themes, which run on the Fynd Theme Engine
2. Headless storefronts, which run on infrastructure managed by the developer or seller

Choose an approach based on the required hosting model, configuration workflow, release process, and operational ownership.

1. Fynd-Hosted Theme

A Fynd-hosted theme runs on the Fynd Theme Engine. Turbo Theme is the reference implementation for this approach.

Choose a Fynd-hosted theme when you need:

• Fynd-managed storefront hosting and delivery
• Seller customization through Theme Editor
• FDK CLI development, preview, sync, and packaging
• Distribution through the Fynd Partners Marketplace

Use the Fynd-Hosted Themes workflow to configure FDK CLI, preview the theme, test it locally, and prepare it for submission.

2. Headless Storefront

A headless storefront runs independently of the Fynd Theme Engine and communicates with Fynd Commerce through APIs. The Headless Turbo theme is the reference implementation for this approach.

Choose a headless storefront when you need:

• Independent hosting and CI/CD
• Control over the application runtime and infrastructure
• Code-driven storefront configuration
• Edge, container, or custom cloud deployment

Your team manages application credentials, domains, TLS, monitoring, deployment, and rollback.

Use the Headless Storefronts workflow to configure the Headless Turbo theme, understand its application runtime, and deploy it to supported infrastructure.

Compare Storefront Approaches

Capability	Fynd-Hosted Theme	Headless Storefront
Reference implementation	Turbo Theme	Headless Turbo theme
Hosting	Fynd Theme Engine	Infrastructure managed by you
Seller configuration	Theme Editor	Repository configuration
Local workflow	FDK CLI	Application development server
API routing	Fynd theme runtime	Fastify or edge API proxy
Application credentials	Managed through FDK theme context	Configured through runtime environment variables
Release workflow	Theme sync, package, and marketplace submission	Application build and CI/CD deployment
Marketplace distribution	Supported	Not applicable
Domain and TLS	Fynd-managed lifecycle	Configured on your hosting platform
Monitoring and rollback	Fynd-managed runtime	Managed by your team
Operations	Fynd-managed theme runtime	Managed by your team

Recognizing What Changes in Headless Storefront

The following workflows do not apply to the Headless Turbo theme:

• fdk theme serve, fdk theme sync, and fdk theme package
• Theme Editor configuration and synchronization
• Theme ZIP packaging
• Partners Marketplace submission and theme rejection review

The Headless Turbo theme replaces these workflows with its application development server, repository configuration, production build, and hosting-platform deployment.

Operational Duties and Ownership when using Headless Turbo Theme

When you choose the Headless Turbo theme, your team must manage:

• Public-scope application credentials
• Build and deployment pipelines
• Hosting capacity and regional availability
• HTTPS, DNS, and custom domains
• Security headers and proxy behavior
• Logging, monitoring, and alerts
• Release rollback and incident response