Themes & Presentation

While passport templates determine what information appears in a Digital Product Passport, themes determine how that information is presented visually. Themes are the presentation layer — they control layout, typography, colour application, section structure, and the overall look and feel of the consumer-facing passport experience.

What Is a Theme?

A theme is a curated visual design system that transforms structured passport data into a polished, branded consumer experience. Each theme defines:

• Layout and structure — how content blocks are arranged on the page
• Typography — heading styles, body text treatment, and visual hierarchy
• Colour application — how the brand’s colours are applied to headers, accents, sections, and backgrounds
• Section presentation — how each content category (materials, sustainability, compliance, etc.) is visually rendered
• Responsive behaviour — how the passport adapts across mobile, tablet, and desktop screens
• Visual details — icons, section dividers, card styles, and micro-interactions

Themes are professionally designed and curated by tieback to ensure a high-quality consumer experience that meets enterprise brand standards.

Brand-Level Theme Assignment

Each brand has a default theme that governs how its passports are presented. The default theme is applied automatically to all passport rendering for that brand.

In the current model:

• every brand is assigned a default theme
• the default theme applies to all products under the brand
• themes respect the brand’s configured visual identity (logo, primary colour, secondary colour)

The result is a passport that looks and feels like a natural extension of the brand’s digital presence — not a generic template.

How Themes and Templates Work Together

Themes and templates are complementary but independent:

The theme receives only the data that the template permits. If a template excludes sustainability fields, the theme will not render a sustainability section — regardless of whether the product record contains that data.

This means:

• Templates protect content boundaries — themes cannot display data that the template has excluded
• Themes enhance presentation — within the permitted content, themes provide the visual polish and branded experience
• Both layers can evolve independently — a brand can adjust its theme without affecting content, and vice versa

Curated Theme Quality

themes are curated — they are designed, tested, and maintained by the platform team to ensure:

• Enterprise-grade visual quality — professional typography, thoughtful spacing, considered colour application
• Mobile-first responsiveness — optimised for the smartphone scanning context that most consumers use
• Accessibility — readable contrast ratios, semantic structure, and accessible interaction patterns
• Brand consistency — faithful application of the brand’s visual identity across all sections and states
• Regulatory clarity — clear, structured presentation of compliance and regulatory information

Themes are not custom HTML/CSS that brands write themselves. They are professionally maintained presentation systems that brands select and configure through their brand settings.

Section Visibility

Themes intelligently handle content completeness. A section is displayed only when it contains at least one populated field from the template’s configuration. If all fields within a content category are empty or excluded by the template, the entire section is hidden automatically.

This means:

• no empty sections appear in the consumer experience
• brands do not need to manually hide sections — the system handles this automatically
• the passport always presents a clean, complete-looking experience regardless of data coverage

Available Themes

includes multiple curated themes, each designed for different presentation styles and brand aesthetics. All themes share the same content-driven rendering engine — switching between themes changes the visual presentation without affecting the content configuration.

Brands select their default theme in brand settings. The selected theme applies to all passport rendering for that brand.

Related Docs

• Passports Overview
• Content & Templates
• Consumer Experience
• Brand Setup & Readiness
• Publication Lifecycle